如何使用JQuery发送按键触发器

时间:2023-01-15 00:09:53

How do i send a trigger keypress of a particular keyCode eg. "9" event on a TextBox using JQuery programmatically?

如何发送特定keyCode的触发按键,例如。使用JQuery编程的TextBox上的“9”事件?

This what i intend to do; Programmatically enter a value to a TextBox and then programmatically trigger a tabkey on the TextBox to exit the field.

这就是我打算做的;以编程方式向TextBox输入值,然后以编程方式触发TextBox上的tabkey以退出该字段。

my code

$("#tags1").val("comp") // Works well

$("#tags1").trigger("keypress",[9]); // Fails!!

Gath

6 个解决方案

#1


The jQuery documents state that it'll only pass normalized event attributes = the properties of the jQuery.Event object, which don't seem to include event-specific data.

jQuery文档声明它只会传递规范化的事件属性= jQuery.Event对象的属性,它们似乎不包含特定于事件的数据。

I tried, and couldn't get it to insert text into a textbox even when reusing an event object that a browser keypress created, so it doesn't seem to be possible.

我尝试过,即使重用浏览器按键创建的事件对象,也无法将文本插入到文本框中,因此似乎不可能。

Why can't you just change the value of the textbox, and call blur() to exit it? (Or focus() on the one you want to enter next?)

为什么你不能只改变文本框的值,并调用blur()退出它? (或者对下一个要进入的人进行聚焦()?)

#2


Not exactly what you asked, but instead of using keypress this might accomplish what you want:

不完全是你问的,但不是使用按键,这可能会实现你想要的:

$("#tags1").blur();

or even

$("#tags1").next().focus();

#3


Try:

 $("#tags1").val("comp").trigger("keypress",[9]); 

or

   $("#tags1").val("comp").trigger("keypress", [{
    preventDefault:function(){},
    keyCode:9
    }]); 

#4


I created a simple jQuery plugin which does solve this problem. It uses the ':tabbable' selector of jQuery UI to find the next 'tabbable' element and selects it.

我创建了一个简单的jQuery插件,可以解决这个问题。它使用jQuery UI的':tabbable'选择器来查找下一个'tabbable'元素并选择它。

Example usage:

// Simulate tab key
$.tabNext();

#5


If you wan to add a value to an input / textarea then fire the keypress "enter" event.

如果您想在输入/ textarea中添加值,则触发按键“enter”事件。

Trigger it like this

像这样触发它

$('input').val( input_value ).blur();

#6


Try this:

$('textarea:input').live('keypress', function(e) {
    if (e.keyCode == 9) {
        e.preventDefault();

        // Press TAB to append a string (keeps the original TEXTAREA text).
        $(this).append("TAB TAB TAB AFTER TEXTAREA TEXT");

        // Press TAB to append a string (keeps the original TEXTAREA text).
        $(this).focus().prepend("TAB TAB TAB BEFORE TEXTAREA TEXT");

        // Press TAB to replace a all text inside TEXTAREA.
        $(this).val("INSERT INTO TEXTAREA / REPLACE EXISTING TEXT");

    }
});

If you want to add text inside the textarea (by the active cursor - like CTRL+V), you might want to use "Tabby" (JS source code) (jQuery plugin - 254 code lines..!).

如果你想在textarea中添加文本(通过活动光标 - 比如CTRL + V),你可能想要使用“Tabby”(JS源代码)(jQuery插件 - 254代码行......!)。

You may also find inspiration in the YUI editor which will let you add TABs inside the editor.

您也可以在YUI编辑器中找到灵感,它可以让您在编辑器中添加TAB。

#1


The jQuery documents state that it'll only pass normalized event attributes = the properties of the jQuery.Event object, which don't seem to include event-specific data.

jQuery文档声明它只会传递规范化的事件属性= jQuery.Event对象的属性,它们似乎不包含特定于事件的数据。

I tried, and couldn't get it to insert text into a textbox even when reusing an event object that a browser keypress created, so it doesn't seem to be possible.

我尝试过,即使重用浏览器按键创建的事件对象,也无法将文本插入到文本框中,因此似乎不可能。

Why can't you just change the value of the textbox, and call blur() to exit it? (Or focus() on the one you want to enter next?)

为什么你不能只改变文本框的值,并调用blur()退出它? (或者对下一个要进入的人进行聚焦()?)

#2


Not exactly what you asked, but instead of using keypress this might accomplish what you want:

不完全是你问的,但不是使用按键,这可能会实现你想要的:

$("#tags1").blur();

or even

$("#tags1").next().focus();

#3


Try:

 $("#tags1").val("comp").trigger("keypress",[9]); 

or

   $("#tags1").val("comp").trigger("keypress", [{
    preventDefault:function(){},
    keyCode:9
    }]); 

#4


I created a simple jQuery plugin which does solve this problem. It uses the ':tabbable' selector of jQuery UI to find the next 'tabbable' element and selects it.

我创建了一个简单的jQuery插件,可以解决这个问题。它使用jQuery UI的':tabbable'选择器来查找下一个'tabbable'元素并选择它。

Example usage:

// Simulate tab key
$.tabNext();

#5


If you wan to add a value to an input / textarea then fire the keypress "enter" event.

如果您想在输入/ textarea中添加值,则触发按键“enter”事件。

Trigger it like this

像这样触发它

$('input').val( input_value ).blur();

#6


Try this:

$('textarea:input').live('keypress', function(e) {
    if (e.keyCode == 9) {
        e.preventDefault();

        // Press TAB to append a string (keeps the original TEXTAREA text).
        $(this).append("TAB TAB TAB AFTER TEXTAREA TEXT");

        // Press TAB to append a string (keeps the original TEXTAREA text).
        $(this).focus().prepend("TAB TAB TAB BEFORE TEXTAREA TEXT");

        // Press TAB to replace a all text inside TEXTAREA.
        $(this).val("INSERT INTO TEXTAREA / REPLACE EXISTING TEXT");

    }
});

If you want to add text inside the textarea (by the active cursor - like CTRL+V), you might want to use "Tabby" (JS source code) (jQuery plugin - 254 code lines..!).

如果你想在textarea中添加文本(通过活动光标 - 比如CTRL + V),你可能想要使用“Tabby”(JS源代码)(jQuery插件 - 254代码行......!)。

You may also find inspiration in the YUI editor which will let you add TABs inside the editor.

您也可以在YUI编辑器中找到灵感,它可以让您在编辑器中添加TAB。