Установить курсор в текст ввода с помощью JQuery

Question

Используя эту тему: jQuery Set Cursor Position in Text Area

я пишу этот код, но он не работает:

<input id="myTextInput" type="text" value="some text2"> 
<input type="button" value="set mouse" id="btn" /> 

и:

$(document).ready(function() { 
    $('#btn').on('click', function() { 
     var inp = $('#myTextInput');   
     var pos = 3; 
     inp.focus(); 
     if (inp.setSelectionRange) { 
      inp.setSelectionRange(pos, pos); 
     } else if (inp.createTextRange) { 
      var range = inp.createTextRange(); 
      range.collapse(true); 
      if (pos < 0) { 
       pos = $(this).val().length + pos; 
      } 
      range.moveEnd('character', pos); 
      range.moveStart('character', pos); 
      range.select(); 
     } 
    }); 
}); 

DEMO

Где моя ошибка? Спасибо

Answer 1

Ваша ошибка в том, что вы выбираете объект jQuery вместо элемента DOM: замените var inp = $('#myTextInput'); на var inp = $('#myTextInput')[0];.

JSFIDDLE

---

Однако я рекомендую использовать плагин от this answer, так как код будет выглядеть чище:

$.fn.selectRange = function(start, end) { 
 
    return this.each(function() { 
 
    if (this.setSelectionRange) { 
 
     this.focus(); 
 
     this.setSelectionRange(start, end); 
 
    } else if (this.createTextRange) { 
 
     var range = this.createTextRange(); 
 
     range.collapse(true); 
 
     range.moveEnd('character', end); 
 
     range.moveStart('character', start); 
 
     range.select(); 
 
    } 
 
    }); 
 
}; 
 

 

 
$(document).ready(function() { 
 
    $('#btn').on('click', function() { 
 
    var pos = 7; 
 
    $('#myTextInput').focus().selectRange(pos, pos); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id="myTextInput" type="text" value="some text2"> 
 
<input type="button" value="set mouse" id="btn" />

Answer 2

Вам нужен элемент DOM, а не Объект JQuery для использования setSelectionRange или createTextRange , Используйте .get(0), чтобы получить его.

var inp = $('#myTextInput'); 
inp.focus(); 
inp = inp.get(0); 

http://jsfiddle.net/qeanb8gk/1/