javascript - 使用 ctrl 键进行多项选择后引发事件

Question

嗨，

我想触发元素列表上的事件。该列表可以有多个选择。如果用户在没有 ctrl 键的情况下单击元素，则应直接触发该事件。
如果用户按下ctrl+click，那么一旦选择完成，事件就会被触发。 我为此编写了自己的逻辑here 。
我可以通过组合 ctrl 来防止事件在点击后立即触发。但我不知道何时触发我自己的函数(在这里说alert...)，如果有多个选择。

Answer 1

var str = "";
$(document).ready(function() {

    // bind only click event

    $('ul > li').on('click', function(event) {

        // if ctrl key is press

        if (event.ctrlKey) {
            str = str + $(this).text() + ",";
        } else {
            str = $(this).text();
            alert(str);
            str = '';  // after alert reset the str
        }
    });

    // bind a keyup event
    $(document).on('keyup', function(event) {

        // str is not empty and ctrl key is released
        // show alert
        if(str && !event.ctrlKey) {
            alert(str);
        } 
        str = ''; // after alert reset the str
    });
});​

DEMO

注意

您不需要为 ctrl 按键维护任何标志。 event.ctrlKey 将为您执行此操作。