使用jQuery选择输入值的第一个字符答案

【问题标题】：Select first character of input value with jQuery使用jQuery选择输入值的第一个字符
【发布时间】：2016-10-27 11:57:15
【问题描述】：

我有一些通过 jQuery 预填充的输入字段。我想获取输入的值，检查它是否以“x”开头，如果是，则选择该 x。（这样用户只需键入其他内容即可快速更改 x）。

我知道这里有这样一个问题：Selecting Part of String inside an Input Box with jQuery

但这是一个非常古老的问题，它并没有真正使用 jQuery！

那么，如何在这个输入的值中选择 x？

<input class="input" type="text" value="x*500*500" />

我试过了：

var input = $('.input');
input.setSelectionRange(0, 2); // Highlights "X"
input.focus();

错误：Uncaught TypeError: input.setSelectionRange is not a function。 setSelectionRange被弃用了吗？

【问题讨论】：

.charAt(0) 做你想做的事吗？
答案可以在这里找到stackoverflow.com/questions/17158802/…

标签： javascript jquery

【解决方案1】：

您必须通过添加 [0] 来取消引用 jQuery 对象。 setSelectionRange 是纯 JavaScript 并处理纯 JS 对象。它不知道 jQuery 对象是什么。顺便说一句，我将第二个参数从 2 更改为 1。~~它的行为不像 MDN has described?~~

片段

var input = $('.input')[0];
input.setSelectionRange(0, 1); // Highlights "X"
input.focus();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input class="input" type="text" value="x*500*500" />

【讨论】：

谢谢你。这就像一个魅力。我对普通的 JS 不太熟悉。第二个参数是 2，因为我正在测试其他设置。
哦，但是如果您查看我发布的链接，您可以根据 MDN 正确执行此操作，但它的行为并不像预期的那样......也许是一个错误？不管怎样，我很高兴能帮上忙。等等，我一定是累了，MDN的描述是正确的。
是的，这很奇怪。可能是错误或错字。哦..等等..哈哈，我要..它在 2 之后开始；D

【解决方案2】：

您将完整元素作为输入变量，获取输入字段的值并检查它是否以字符开头

var input = $('.input').val();
if(input.str.startsWith('X')){
    e.focus();
    var pos = e.val().indexOf('x');
    e.prop({
        'selectionStart': pos,
        'selectionEnd': pos + 1
    });
}

【讨论】：

【解决方案3】：

var e = $('[data-field=test]');
setTimeout(function () {
  e.focus();
  var pos = e.val().indexOf('x');
  e.prop({
    'selectionStart': pos,
    'selectionEnd': pos + 1
  });
}, 100);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input data-field="test" value="hello x 123">

【讨论】：