Question

I need a fix for this… Because this is very annoying, due to the fact that is happens every 1000 milliseconds!!!

Here’s the full code:

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script>
function insertTextAtCursor() {
    var sel, range, html;
    if (window.getSelection) {
        sel = window.getSelection();
        if (sel.getRangeAt && sel.rangeCount) {
            range = sel.getRangeAt(0);
            range.deleteContents();
            range.insertNode( document.createTextNode('567') );
        }
    } else if (document.selection && document.selection.createRange) {
        document.selection.createRange().text = text;
    }
}
</script>


<div contenteditable onclick="insertTextAtCursor()">hi</div>


<script>
  setInterval(function() {
$("body").html($("body").html().replace(/567/g,'<b>abcde-fghi</b>'));
  },1000);
</script>

Answer 1

You can stop the interval when the div has focus and then start it again on blur. I’d also change up the interval function by adding an id and replacing only those contents. Also, I think a little cleaner way might be to do the interval and the replace data in a hidden element.

http://jsfiddle.net/lucuma/AKtvt/

function insertTextAtCursor() {
    var sel, range, html;
    if (window.getSelection) {
        sel = window.getSelection();
        if (sel.getRangeAt && sel.rangeCount) {
            range = sel.getRangeAt(0);
            range.deleteContents();
            range.insertNode( document.createTextNode('567') );
        }
    } else if (document.selection && document.selection.createRange) {
        document.selection.createRange().text = text;
    }
} 

function ReplaceData() {

    $("#contentdata").val($("#content").html().replace(/567/g,'<b>abcde-fghi</b>'));

    }

$(document).ready(function() {
    var ph=setInterval(ReplaceData,1000);


    $('#content').on("blur", function() {
       $('#content').html($('#contentdata').val());
        ph=setInterval(ReplaceData,1000);
    });

});

​
​