以编程方式在文本输入中按“向左”键

时间:2010-05-14 03:35:30

标签: javascript javascript-events dom-events

我正在尝试以编程方式触发一个关键事件,在文本框中向左移动,但没有任何运气。

输入元素具有焦点,光标位于末尾。我试图让光标向左移动一步 - 在字母“F”之前*以编程方式触发键盘事件(keydown / keyup / keypress),并使用相应的击键←或→以输入框为目标。

ABCDEF |

到目前为止,这是代码:

HTML

<input id="a" type="text" />

的Javascript

var keyEvent = document.createEvent("KeyboardEvent");

var keyLocation = '0x00';
var keyIdentifier = "Left";

keyEvent.initKeyboardEvent("keypress",
                        true,
                        true,
                        window,
                        keyIdentifier,
                        keyLocation,
                        false);

$("a").dispatchEvent(keyEvent);

如果您想查看整个代码,请在jsfiddle上保存一个快速演示 - http://jsfiddle.net/Vsafv/

我对制作这种跨浏览器不感兴趣(只是让它在Chrome中运行)。谢谢你的帮助。

4 个答案:

答案 0 :(得分:10)

e = jQuery.Event("keydown"); // define this once in global scope
e.which = 37; // Some key value
$("input").trigger(e);

其中“input”是你的textarea

37 - 左
38 - up
39 - 右
40 - 向下

因此,当您录制“事件”时,您会记录按下的键的值 我相信你已经想出办法来做到这一点,但为了以防万一,这里有一个关于如何解决它的想法:

var keysPressed = new Array(); // somewhere in the global scope
$("input").keydown(function (e) {
    keysPressed.push(e.which); //adding values to the end of array
});

希望这有帮助

答案 1 :(得分:8)

对于那些没有将jQuery视为一切解决方案的人:)

来自http://blog.josh420.com/archives/2007/10/setting-cursor-position-in-a-textbox-or-textarea-with-javascript.aspx

function setCaretPosition(elemId, caretPos) {
    var elem = document.getElementById(elemId);

    if(elem != null) {
        if(elem.createTextRange) {
            var range = elem.createTextRange();
            range.move('character', caretPos);
            range.select();
        }
        else {
            if(elem.selectionStart) {
                elem.focus();
                elem.setSelectionRange(caretPos, caretPos);
            }
            else
                elem.focus();
        }
    }
}

答案 2 :(得分:1)

你可以看看这个StackOverflow问题 - &gt; jQuery Set Cursor Position in Text Area

答案 3 :(得分:1)

据我所知,你可以这样做:

var pos = document.getElementById("a").length; 
document.getElementById("a").setSelectionRange(pos-1, pos-1);