-4

Good afternoon. Tell me how to disable elements of the translation itself the focus? By clicking on the div it should not translate themselves focus. Thank U.

https://jsfiddle"dot"net/ironviper/boyorkdy/

If you click the mouse in the "My text here", then click on "CLECK ME i'm button" then the focus will remain in the field "My text here". If you click the mouse in the "My text here", then click on "CLECK ME i'm div" is the focus leaves the field "My text here". How do I disable the focus away from the field "My text here" when you click on "CLECK ME i'm div"?

iron-viper
  • 88
  • 1
  • 2
  • 8

1 Answers1

0

You can set focus bact to the editable div. I found 'setEndOfContenteditable' function from How to move cursor to end of contenteditable entity

<!DOCTYPE html>
<html>
<head>
</head>
<body>
    <div id="editId" contenteditable="true">My text here</div>
    <div id="myDiv" onclick="myclick();">CLICK ME i'm div</div>
</body>
<script>
    function myclick() {
        var el = document.getElementById("editId");
        el.focus();
        setEndOfContenteditable(el);
    }

    function setEndOfContenteditable(contentEditableElement) {
        var range, selection;
        if (document.createRange)//Firefox, Chrome, Opera, Safari, IE 9+
        {
            range = document.createRange();//Create a range (a range is a like the selection but invisible)
            range.selectNodeContents(contentEditableElement);//Select the entire contents of the element with the range
            range.collapse(false);//collapse the range to the end point. false means collapse to end rather than the start
            selection = window.getSelection();//get the selection object (allows you to change selection)
            selection.removeAllRanges();//remove any selections already made
            selection.addRange(range);//make the range you have just created the visible selection
        }
        else if (document.selection)//IE 8 and lower
        {
            range = document.body.createTextRange();//Create a range (a range is a like the selection but invisible)
            range.moveToElementText(contentEditableElement);//Select the entire contents of the element with the range
            range.collapse(false);//collapse the range to the end point. false means collapse to end rather than the start
            range.select();//Select the range (make it the visible selection
        }
    }
</script>
</html>
Community
  • 1
  • 1
Suat Keskin
  • 116
  • 5