0

当用户在 上的任意位置按下 Enter 键时body，它会触发另一个元素上的单击事件，从而打开一个基本的警报弹出窗口（用于测试目的）。

这会创建一个循环，因为再次按 Enter 将关闭警报，但会再次触发事件，打开一个新警报，然后循环重复。

我在模态框脚本中使用它。当模态框出现时，用户可以按 Enter 来执行模态框内的按钮将执行的操作，例如关闭它（或者在我的情况下，打开一个警报弹出窗口）。

点击代码：

//Add click events...
button.bind('click', mybtn, function(e) {
    var click;

    if (e.data.onclick) {
        e.data.onclick(e);
    } else if (e.data.click) {
        e.data.click(e);
    }
});

关键代码：

//Add key events...
$('body').keyup(mybtn, function(e) {
    var keyCode = e.keyCode || e.which;

    //What key we need to match...
    switch (e.data.key) {
        case 'enter':
            if (keyCode == 13)          e.data.button.trigger('click');
            break;

        case 'esc':
        case 'escape':
            if (keyCode == 27)          e.data.button.trigger('click');
            break;
    }
});

我应该在不同的地方（元素）绑定我的事件吗？有没有更好的方法来绑定来停止这个循环？

我无法取消绑定键事件，因为我的脚本需要足够灵活以处理多个按键。

创建模态框的示例：

createModal('HTML <b>content</b>', [{ label: 'Close', onclick: function() { alert('Modal closed'); }, key: 'enter' }]);

HTML 内容被转储到模式中，然后该函数将循环通过您定义的控件并尝试为您构建它们。在此示例中，您定义了一个“关闭”控件，如下所示（如果您使用了onclick=""）：

<button onclick="function() { alert('Modal closed'); }">Close</button>

分配给文档的事件，当您按 Enter 时，它将触发单击该按钮，从而导致问题。

4

1 回答 1

1 
button.one('click', mybtn, function(e) {
    var click;

    if (e.data.onclick) {
        e.data.onclick(e);
    } else if (e.data.click) {
        e.data.click(e);
    }
});

将单击事件限制为仅发生一次，然后它会自行解除绑定。

于 2013-07-12T02:19:02.283 回答