dynamically changing syntax using highlightjs

Question

var d;

$("#ing").keyup(function(){

    d= $("#ing").val();

    $("#lipu").html(d);
});

This is the code i am using to change the text inside the div dynamically:

hljs.initHighlightingOnLoad();

This line of code helps in syntax highlighting when the code is hardcoded in the tags and works perfectly when page loads.

I want to do the exact same thing when I write the text inside the textbox and the highlighted text be displayed inside the div

I have tried to use following functions

hljs.initHighlighting.called = false;

hljs.initHighlighting();

But it did not work...

Please help I know there is a very simple solution but I couldn't find it on internet....

Oliboy50 · Accepted Answer · 2014-07-04 21:18:50Z

5

According to the doc : http://highlightjs.org/usage/ this code should work :

$("#ing").on("input", function(){ // Always prefer the 'input' event instead of keyup

    hljs.highlightBlock($("#lipu").html($(this).val()).get(0));

});

OR (to be clearer)

$("#ing").on("input", function(){ // Always prefer the 'input' event instead of keyup
    $("#lipu").html($(this).val());
    hljs.highlightBlock($("#lipu").get(0)); // highlightBlock expect a DOM element
});

answered Jul 4, 2014 at 21:18

Oliboy50

2,7513 gold badges33 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Uzumaki Naruto Over a year ago

Yeah it worked !! Thanks man!! been searching about it for the past 5 hours. :)

Collectives™ on Stack Overflow

dynamically changing syntax using highlightjs

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related