javascript - 使用输入类型编号获取光标位置

Question

我想获取 <input> 中光标的位置。这是我正在使用的代码:

$("input").keyup(function() {
    $("<p>")
    .html("Cursor position at " + $("input").caretPosition())
    .appendTo("#test");
});

和caretPosition定义为(只是 selectionStart 的包装):

$.fn.caretPosition = function() {
    if (!this.length) return;
    var input = this[0];
    try {
      return input.selectionStart;
    } catch(e) {
      // No need for old IE support
      return 0;
    }
}

HTML

<input type="number" />
<div id="test">
</div>

不幸的是，这在 Chrome 中不起作用，但在 Firefox 中却可以。在 Chrome 中，它打印 0每时每刻。这会让我认为 chrome 不支持 selectionStart但我读到它确实支持 selectionStart 。如果我改变 type="number" ，这一事实就支持了这一点。至type="text"它开始工作。如何让它在 type="number" 的浏览器中一致工作？ (不是 IE，不需要支持)。

我已阅读https://stackoverflow.com/a/2897510/3371119但它对我不起作用(在 Chrome 中)。

Jsfiddle:http://jsfiddle.net/prankol57/zbaaky5z/2/

编辑:我已确认 selectionStart in input返回真。那么为什么会抛出错误呢？

Answer 1

正如 @int32_t 所指出的，这对于 <input type="number" /> 来说是不可能的。 。我把它改为<input type="text" />并能够接收此功能；我添加了自己的数字验证方法，如下所示:

function validate(k) {
  return !isNaN(parseFloat(k)) && !isNaN(+k);
}

事实上，如果删除 try {} catch {}语句，chrome 抛出一个非常描述性的错误:

Uncaught InvalidStateError: Failed to read the 'selectionStart' property from
'HTMLInputElement': The input element's type ('number') does not support
selection.