仅第一次发出jQuery多选择器警报

我的问题是，单击“全部取消选择”时，我会收到每个取消选择项目的警报/确认消息。有没有办法避免这种情况，并且只收到一次此消息

jquery

使用.prop'checked'，而不是使用.click切换复选框，如下所示：

$('selector').one('click', function(event){....});

这应该避免触发.change处理程序，因为它会引发一波警报。

你好吗

请尝试对代码进行以下小修改：

//Function called on "select all/deselect all"
$('#span_descr > div:last-child').on('click', 'span:first-child', function(){
     $('[id^=old_]:not(:checked)').prop('checked', true);
}).on('click', 'span:last-child', function(){
    $('[id^=old_]:checked').prop('checked', false);
});

问候。

试试这个

//Function called by single element or multiple times (see below)
var alreadyReprised = null;
$('[id^=old_]').change(function(){
    var check = $(this).prop('checked') ? true : false;

    if(check){
         /* stuff here */
    }else{

        var reprise = alreadyReprised || confirm('Are you sure?');
        if(reprise){

            if(alreadyReprised === false) {
                alreadyReprised = true;
            }
            /*  do stuff */
        }else{
            $(this).prop('checked', true);  
        }

    }
});

//Function called on "select all/deselect all"
$('#span_descr > div:last-child').on('click', 'span:first-child', function(){
     $('[id^=old_]:not(:checked)').click();
}).on('click', 'span:last-child', function(){
    alreadyReprised = false;
    $('[id^=old_]:checked').click();
    alreadyReprised = null;
});

---

我想您只需要将所有必须在click处理程序之外执行的内容都包含在内，这样就可以从其他代码中引用它。它不漂亮，但很有效：

//Function called by sigle element or multiple times (see below)
$('[id^=old_]').change(function(){
    var check = $(this).prop('checked') ? true : false;

    if(check){
         /* stuff here */
    }else {
        var reprise = null;

        if($(this) == ('[id^=old_]:first-child'))
          reprise = confirm('Are you sure?');

        if(reprise){
            /*  do stuff */
        }else{
            $(this).prop('checked', true);  
        }
    }
});

//Function called on "select all/deselect all"
$('#span_descr > div:last-child').on('click', 'span:first-child', function(){
     $('[id^=old_]:not(:checked)').click();
}).on('click', 'span:last-child', function(){
    $('[id^=old_]:checked').click();
});

检查

---

另一种解决方案是防止复选框上的默认所有单击事件，并自己选中/取消选中它们。这将允许您更好地分离单击的概念复选框和选中的复选框，这将带来更干净的代码。但是，我不太喜欢阻止默认行为，因为您永远不知道默认行为是什么。

一种方法是使用eventData

下面是一个从checkAll复选框将数据传递给更改处理程序的示例。这允许您查看该数据是否存在，从而知道更改事件是由用户触发的还是由外部触发的

//Function called by sigle element or multiple times (see below)
$('[id^=old_]').change(function(){
    var check = $(this).prop('checked') ? true : false;

    if(check){
         onSelected(this);
    }else{
        var reprise = confirm('Are you sure?');
        if(reprise){
            onDeselected(this);
        }else{
            $(this).prop('checked', true);  
        }
    }
});

function onSelected(checkbox){
    /* stuff here */
    console.log("selected");
}

function onDeselected(checkbox){
    /*  do stuff */
    console.log("deselected");
}

//Function called on "select all/deselect all"
$('#span_descr > div:last-child').on('click', 'span:first-child', function(){
     $('[id^=old_]:not(:checked)').click();
}).on('click', 'span:last-child', function(){
    if(confirm('Are you sure?')){
        var checked = $('[id^=old_]:checked');
        checked.prop('checked', false);
        checked.each(function(index, elem){
            onDeselected(elem);
        });
    }
});

参考：

注意，所有jQuery事件处理程序都允许使用触发器传递数据参数

---

这不会执行函数中的其他内容。。。。但只需取消选中复选框如果要执行其他操作，则需要将它们放在单独的函数中，并从此处以及从$'[id^=old_3;]'调用它。更改。。。处理程序。如果触发单击事件，它将触发单击处理程序中的所有内容，包括警报。这不会真正起作用，因为它只会在第一次单击复选框时触发，而不会在以后单击时触发。

//Function called by sigle element or multiple times (see below)
$('[id^=old_]').change(function(){
    var check = $(this).prop('checked') ? true : false;

    if(check){
         onSelected(this);
    }else{
        var reprise = confirm('Are you sure?');
        if(reprise){
            onDeselected(this);
        }else{
            $(this).prop('checked', true);  
        }
    }
});

function onSelected(checkbox){
    /* stuff here */
    console.log("selected");
}

function onDeselected(checkbox){
    /*  do stuff */
    console.log("deselected");
}

//Function called on "select all/deselect all"
$('#span_descr > div:last-child').on('click', 'span:first-child', function(){
     $('[id^=old_]:not(:checked)').click();
}).on('click', 'span:last-child', function(){
    if(confirm('Are you sure?')){
        var checked = $('[id^=old_]:checked');
        checked.prop('checked', false);
        checked.each(function(index, elem){
            onDeselected(elem);
        });
    }
});

var $checks = $(':checkbox:not(#check_all)').change(function(e ,isTriggerEvent, isChecked){
    if(!isTriggerEvent){
       if(this.checked)
       alert('Manually changed') ;
       /* see if check_all needs to be changed when user checks or unchecks a checkbox */  
        var allChecked = !$checks.filter(':not(:checked)').length;
        $('#check_all').prop('checked',allChecked);    
    }else{
        /* match checked state to "check_all" state */
        this.checked = isChecked;
    }       
});

$('#check_all').change(function(e){ 
    /* 1st param in eventData tells other checkboxes is a trigger, 2nd param to send state */   
    $checks.trigger('change',[true, this.checked]);        
});