Как найти позицию курсора внутри тега тела

Question

Я хочу знать позицию курсора внутри тега тела. Обычно я хочу, чтобы позиция курсора находилась внутри тега span, имеющего редактирование класса, тогда я хочу, чтобы курсор не прыгал на новую строку при нажатии клавиши Enter. И если позиция курсора вне тега span, то курсор перейдет к новой строке при нажатии клавиши ввода. Я был бы очень благодарен вам, если вы предоставите решение с примером. Я не настолько силен в javascript.I знаю, чтобы остановить курсор, прыгающий на новую строку. Код для этого будет.

$('p').keydown(function(e){ 
    e.preventDefault(); 
    }); 

Но в моем случае предупреждение должно быть только в том случае, если курсор находится внутри тега span.

Заранее спасибо.

Answer 1

Попробуйте это:

var canPressEnter = true; 
$("span.edit").on("focus", function(){ 
    canPressEnter = false; 
}).on("keypress", function(e){ 
    var code = (e.keyCode ? e.keyCode : e.which); 
    if (canPressEnter === false && code === 13) 
    { 
     e.preventDefault(); 
    } 
}).on("blur", function(){ 
    canPressEnter = true; 
}); 

http://jsfiddle.net/hescano/S6hzY/

Если вам не нужен флаг где-то еще, это будет делать:

$("span.edit").on("keypress", function(e){ 
    var code = (e.keyCode ? e.keyCode : e.which); 
    if (code === 13) 
    { 
     e.preventDefault(); 
    } 
}); 

http://jsfiddle.net/hescano/S6hzY/1/

Это работает для меня:

tinyMCE.init({ 

    theme : "advanced", 
    mode: "exact", 
    elements : "elm1", 
    setup : function(ed) { 
    ed.onInit.add(function(ed, evt) { 
     tinymce.dom.Event.add(ed.getDoc(), 'keydown', function(e) { 
      var existing = tinyMCE.get('elm1').getElement(e); 
      var code = (e.keyCode ? e.keyCode : e.which); 
      var spans = tinyMCE.activeEditor.getBody().getElementsByTagName("span"); 
      if (spans.length > 0) 
      { 
       for (var i = 0; i < spans.length; i++) 
       { 
        if (spans[i].getAttribute("class") === "AMedit") 
        { 
        if (code === 13) 
        { 
         e.preventDefault(); 
        } 
        } 
       } 
      } 
     }); 
     }); 
    }, 
     themes... 

Answer 2

Если нет выбора, вы можете использовать свойства .selectionStart или .selectionEnd (без выбора они равны).

var cursorPosition = $('#myTextarea').prop("selectionStart"); 

Обратите внимание, что это не поддерживается в старых браузерах, в первую очередь IE8-.

Answer 3

Надеюсь, это может быть полезно для вас.

$('#myarea')[0].selectionStart; // return start index of cursor