什么是最好的方法(我假设最简单的方法),以放置光标在文本的输入文本元素的末尾通过JavaScript -焦点已设置到元素?


当前回答

拿出一些答案。制作单行jquery。

$('#search').focus().val($('#search').val());

其他回答

试试这个,它对我很有效:

//input is the input element

input.focus(); //sets focus to element
var val = this.input.value; //store the value of the element
this.input.value = ''; //clear the value of the element
this.input.value = val; //set that value back.  

为了让光标移动到最后,输入必须先有焦点,然后当值改变时,它才会移动到最后。如果你将.value设置为相同的值,它在chrome中不会改变。

拿出一些答案。制作单行jquery。

$('#search').focus().val($('#search').val());

简单。在编辑或更改值时,首先放置焦点,然后设置值。

$("#catg_name").focus();
$("#catg_name").val(catg_name);

el.setSelectionRange(-1, -1);

https://codesandbox.io/s/peaceful-bash-x2mti

这个方法更新HTMLInputElement。selectionStart selectionEnd, 和selectionDirection属性一次调用。

https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setSelectionRange

在其他js方法中,-1通常表示(到)最后一个字符。这也是这种情况,但我在文档中找不到明确提到的这种行为。

我也面临着同样的问题。这个终于对我有用了

jQuery.fn.putCursorAtEnd =  = function() {

  return this.each(function() {

    // Cache references
    var $el = $(this),
        el = this;

    // Only focus if input isn't already
    if (!$el.is(":focus")) {
     $el.focus();
    }

    // If this function exists... (IE 9+)
    if (el.setSelectionRange) {

      // Double the length because Opera is inconsistent about whether a carriage return is one character or two.
      var len = $el.val().length * 2;

      // Timeout seems to be required for Blink
      setTimeout(function() {
        el.setSelectionRange(len, len);
      }, 1);

    } else {

      // As a fallback, replace the contents with itself
      // Doesn't work in Chrome, but Chrome supports setSelectionRange
      $el.val($el.val());

    }

    // Scroll to the bottom, in case we're in a tall textarea
    // (Necessary for Firefox and Chrome)
    this.scrollTop = 999999;

  });

};

我们可以这样称呼它:

var searchInput = $("#searchInputOrTextarea");

searchInput
  .putCursorAtEnd() // should be chainable
  .on("focus", function() { // could be on any event
    searchInput.putCursorAtEnd()
  });

它适用于safari, IE, Chrome, Mozilla。在移动设备上,我没有尝试过这种方法。