Question

我正在使用jquery.confirm，我从http://myclabs.github.io/jquery.confirm/

中选择了

目标： - 我试图在检查时弹出一个包含不同文本的确认框，并取消选中该复选框。选中复选框后，会弹出一个显示消息"Are You Sure to add the media"的确认框，如果用户点击“我是”，我发送相应的ajax调用以添加媒体并使checked属性为true。取消选中该复选框后，将弹出确认消息显示消息"Are you Sure to delete the media"，如果用户选择“是我是”，则正在进行ajax调用以进行删除，并且checked属性设置为false。

复选框是：

<input type="checkbox" id="media">

现在问题是虽然流程正常，但确认框在选中和取消选中复选框时显示相同的textMessage。

"Are You sure to add the media".

相反，它应该更改文本，因为textMessage在每次检查时都会更改并取消选中。这是我第一次使用确认框。

这是代码。

var textMessage=" to add the media?";
    $('#media').change(function() {
            //var checked=$(this).is(":checked");
            var me=this;
            $("#media").confirm({
                            title:"Confirmation",
                            text:"Are You Sure" + textMessage,
                            confirm: function(btn) {
                                if(textMessage === " to add the media"){
                                    $(me).prop("checked", true);
                                    mediachecked=false;
                                    textMessage=" to delete the media?";
                                    //Making the ajax calls for addition                                                          
                                    }
                                else{
                                    $(me).prop("checked",false);
                                    mediachecked=true;
                                    textMessage=" to add the media?";
                                    //Making the ajax calls for deletion
                                    }
                            },
                            cancel: function(btn) {
                            },
                             confirmButton: "Yes I am",
                             cancelButton: "No"
                            });
        });

提前感谢您的帮助。

Answer 1

好的，我想我弄清楚了。 jQuery.confirm希望您将事件附加到按钮（或您的案例中的复选框）。你完成它的方式，你应该使用手动触发方法。无论如何，我能够在不修改过多代码的情况下使用它：

//The checkbox. Notice the data attribute that will hold the confirm text message
<input type="checkbox" id="media" data-text="Are you sure you want to add the media?" />

以下是jQuery代码（为简洁起见）。而不是监听复选框的change事件，并且每次重新附加confirm事件监听器（这是代码的问题），您应该立即将confirm事件监听器附加到复选框，然后使用某种方法更改确认对话框文本。我使用data-属性来存储文本，jQuery.confirm自动使用该文本作为提示文字。见下面的代码：

//Notice the btn.data(...) call to change value of 'data-text'...
$("#media").confirm({
    title:"Confirmation",
    confirm: function(btn) {
        if(!btn.is(":checked")){
            btn.prop("checked", true);
            btn.data("text","Are you sure you want to delete the media?");
            //Making the ajax calls for addition                                                          
        }else{
            btn.prop("checked",false);
            btn.data("text","Are you sure you want to add the media?");
            //Making the ajax calls for deletion
        }
    },
    cancel: function(btn) {},
    confirmButton: "Yes I am",
    cancelButton: "No"
});

在复选框的change事件上使用jquery.confirm函数

1 个答案: