在复选框的更改事件上使用jquery.confirm函数
我使用的是jquery.confirm，这是我从http://myclabs.github.io/jquery.confirm/上学到的
目标:-我正在尝试弹出一个包含不同文本的复选框和取消复选框的确认框。在选中复选框时，会弹出一个确认框，显示消息"Are You Sure to add the media"，如果用户单击"Yes I am"，我将发送相应的ajax调用，以添加媒体并使选中的属性变为真。在取消选中复选框时，确认应该弹出以显示消息"Are you Sure to delete the media"，同样，如果用户选择"Yes I am"，则将进行ajax调用以便删除，选中的属性设置为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"
});
});提前谢谢你的帮助。
回答 1
Stack Overflow用户
发布于 2015-04-03 09:42:59
好吧，我想我搞清楚了。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事件，而且每次都重新附加确认事件侦听器(这是代码的问题)，您应该立即将确认事件侦听器附加到复选框，然后使用某种方法更改确认对话框文本。我使用了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"
});https://stackoverflow.com/questions/29429166
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号