2014-07-15 107 views
0

这里的想法是,函数只需要运行任何输入/ textarea/select的下一个焦点,但是一次性函数可以重置为再次运行。JQuery将焦点事件附加到下一个焦点输入

一个简单的例子是选中了一个复选框,然后在任何其他字段上的下一个焦点事件上运行检查以查看该字段是否具有特定的属性值(具有多个可能的字段为真)。这应该允许用户取消选择复选框,然后再次选中复选框以再次触发相同的事件。

值得注意的是,测试复选框是否被选中不是一个选项,因为这个附加的焦点事件应该能够设置模糊,点击或任何其他类型的字段的jQuery事件。

我现在的想法是设置在处理每个焦点事件查了全局JavaScript变量:

var checkFocus = false;

然后,设置焦点事件的所有表单域,包括输入,文本区域等:

$('input').focus(function(){ 
    if(checkFocus){ 
    // Put the target code here. 
    checkFocus = false; 
    } 
}); 

这将允许代码的任何部分将checkFocus设置为true,然后告诉焦点事件运行目标代码。

有没有办法抓住每个元素的所有焦点事件?如果是这样,是否有办法运行一次性事件,如果需要,还可以设置为再次运行一次?

编辑

有一种方法,使一个焦点事件,一时间只事件,但这并不包括任何形式的字段不是输入的元素,如文本区域或选择。这可以使用off(event)函数完成。我不确定这是否对这个问题有所帮助,因为对其他选择器的这样做实际上会使代码多次出现。

$("input").on("focus", function(event) { 
    alert("This will be displayed only once."); 
    $(this).off(event); 
}); 
+0

如果收音机被选中,你只是想在元素的焦点上执行某些操作?或者是其他东西? –

+0

是的,但收音机的值应与焦点事件中的目标代码无关。 – Siphon

+0

需要玩的东西是使用jQuery的one()来附加处理程序,并在处理程序内再次附加。 –

回答

0

经过广泛的谷歌搜索,我能回答我的问题...

这是你将如何设置事件(这可以在任何地方设置):

var id = 'something'; 
var name = 'something-else'; 

// Bind the event to three tags commonly used on forms 
$("input, select, textarea").on("focus", {id: id, name: name}, focusEvent); 

这是focusEvent函数,将处理上的场聚焦的逻辑:

var focusEvent = function(event){ 
    // Commonly used values for an event 
    var id = event.data.id; 
    var name = event.data.name; 
    var focused_id = $(this).attr('id'); 
    var focused_name = $(this).attr('name'); 

    // Do something on the next focus event 

    // Unbind the one-time event 
    $("input, select, textarea").off("focus", focusEvent); 
} 

这是我能想到的最简单的设置,不需要全局变量,也不需要设置需要单独处理的多个事件。

最初未包含在问题中的一个部分是.on()函数使用event.data将参数传递给定义的事件函数的能力。这最终使我在编写焦点事件逻辑时变得更加轻松。

另外,这个解决方案的好处在于事件可以取消绑定,具体取决于事件函数的逻辑。这可以将一次性事件转变为可能的一次性事件。