jquery确认插件不工作
问题描述:
我正在尝试使用jquery1.8.3的jquery插件。但事件处理程序(警报)对任何一个按钮都不起作用。jquery确认插件不工作
<!DOCTYPE html>
<html>
<body>
<button class="confirm" type="button">Delete the comment</button>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" />
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="jquery.confirm.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".confirm").confirm({
text: "Are you sure you want to delete that comment?",
title: "Confirmation required",
confirm: function(button) {
alert("foo")
},
cancel: function(button) {
alert("bar")
},
confirmButton: "Yes I am",
cancelButton: "No",
post: true
});
});
</script>
</body>
</html>
任何线索?
答
尝试这样的:
$(document).ready(function(){
$(".confirm").click(function(){
$.confirm({
'message': "Are you sure you want to delete that comment?",
'title': "Confirmation required",
'buttons': {
'Yes': {
'action': function(){
alert();
}
},
'No': {
'action': function(){
alert()
}
}
});
});
});
我不明白为什么你把一个按钮作为参数。
+0
没有运气。尽管按钮可以用于那里// modal.find(“。confirm”)。click(function(){settings.confirm(settings.button); }); – navyad
答
我看到你正在尝试使用自定义确认插件,你需要下载jQuery确认插件和引导程序。相反,我使用jquery提供的代码在我的php项目中创建插件,它的工作非常完美。请参阅下面的代码。它对我来说非常完美。检查此链接以获取更多信息。 https://jqueryui.com/dialog/#modal-confirmation
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script type="text/javascript">
$(document).ready(function(){
$("#submitbutton").click(function() {
$("#dialog-confirm").dialog("open");
});
$("#dialog-confirm").dialog({
autoOpen: false,
height: 400,
width: 400,
resizable: false,
modal: true,
buttons: {
"Confirm": function() {
alert("Clicked Confirm");
$(this).dialog("close");
},
Cancel: function() {
alert("Clicked Cancel");
$(this).dialog("close");
}
}
});
});
</script>
</head>
<body>
<input type="button" id="submitbutton" value="Submit"/>
<div id="dialog-confirm">
<p>Are you sure?</p>
</div>
</body>
</html>
如果你看一下要求,它说**的情态动词引导3 ** –
为bootstrap3更新的代码,但有错误confirm.js文件在modal.modal(“秀”); – navyad
如果你也使用CSS,它工作正常[FIDDLE](http://jsfiddle.net/L7yuL/1/) –