Question

我尝试了很多关于如何在输入框上点击获取光标位置的stackoverflow讨论（但许多处理使用插入符来获取突出显示的位置） - 但似乎没有任何东西适用于我非常简单的要求。

我想要的只是一个功能，当点击一个鼠标时会返回光标的位置（从字母数开始） - 请注意，按位置我的意思是字符位置。

当你点击可编辑输入框上的某个地方并且上面有一些文字时，我希望在点击之后得到光标的位置（从开始的字符数开始） - 这样我就能记住这个将来点击（针对某些特定的UI要求）。 -

是否有jQuery（或javascript）函数可以执行？任何变通办法都是受欢迎的。

由于

编辑 - 有些人指示我去其他帖子 - 但请注意我不能使用jQuery Caret或任何其他插件。我得到的只是jQuery。

Answer 1

获得解决方案 。请尝试使用以下代码并验证结果 -

<html>
<head>
<script>
    function f1(el) {
    var val = el.value;
    alert(val.slice(0, el.selectionStart).length);
}
</script>
</head>
<body>
<input type=text id=t1 value=abcd>
    <button onclick="f1(document.getElementById('t1'))">check position</button>
</body>
</html>

我正在给你fiddle_demo

Answer 2

假设HTML：

<input id="target" />

以下代码为您提供鼠标光标的坐标：

$('#target').click(function(jqEvt){
    console.log('Coordinates within textbox', jqEvt.offsetX, jqEvt.offsetY);
    console.log('Global coordinates', jqEvt.clientX, jqEvt.clientY);
});

请参阅jQuery.Event

Answer 3

将其放入<input type=image/>

当您使用<input type=image/>标记时，您告诉浏览器提交单击图像的x和y坐标。这允许您向表单添加图像映射类型功能。

获取光标在<input />中的位置

3 个答案: