Javascript 确认对话框
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/4292455/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Javascript confirm dialog
提问by Upvote
I want to add a confirm dialog to a delete button to ask the user whether it is ok or not deleting the selected item.
我想在删除按钮上添加一个确认对话框,询问用户是否可以删除所选项目。
If not, nothing should happend, else a url should be executed.
如果没有,什么都不应该发生,否则应该执行一个 url。
I know how to realize this via some javascript code but I am looking for a solution that has less code. I mean e.g. :
我知道如何通过一些 javascript 代码来实现这一点,但我正在寻找一种代码较少的解决方案。我的意思是例如:
<a href="mysite.de/xy/delete" onClick="...">Delete</a>
Is it possible to put the whole functionality in the onClick element without having some extra javascript in the header?
是否可以将整个功能放在 onClick 元素中,而无需在标题中添加一些额外的 javascript?
回答by Nick Craver
回答by GolezTrol
Better (though far from ideal!): turn it around. Don't let the link do anything, unless you got JavaScript:
更好(虽然远非理想!):扭转局面。不要让链接做任何事情,除非你有 JavaScript:
<a href="#"
onclick="if confirm('Sure?') { window.location='http://mysite.de/xy/delete';}">
Click to delete
</a>
This at least prevents the link to work without JavaScript. This also reduces the risk of the link accidentally being crawled by Google, or even by some local plugin. (Image if you had a plugin that would try to load/show as thumbnail) the target page on hover of a link!)
这至少可以防止链接在没有 JavaScript 的情况下工作。这也降低了链接被 Google 甚至某些本地插件意外抓取的风险。(如果你有一个插件会尝试加载/显示为缩略图)链接悬停时的目标页面!)
Still, this solution is not ideal. You will actually browse to the url, and the url might show up in the history because of that. You could actually delete Bob, create a new Bob, and then delete that one by accident by just clicking 'back' in the browser!
尽管如此,这个解决方案并不理想。您实际上将浏览到该 url,因此该 url 可能会显示在历史记录中。您实际上可以删除 Bob,创建一个新的 Bob,然后通过单击浏览器中的“返回”意外删除那个!
A better option would be to use JavaScript or a form to post the desired action. You can make a request to the server with the POST method, or arguably better, the DELETE method. That should also prevent the urls from being indexed.
更好的选择是使用 JavaScript 或表单来发布所需的操作。您可以使用 POST 方法或可以说更好的 DELETE 方法向服务器发出请求。这也应该防止网址被索引。
回答by cspolton
Consider what happens if the user has javascript disabled, or if google comes along and spiders the link. Will your entity be deleted?
考虑一下如果用户禁用了 javascript,或者 google 出现并抓取链接会发生什么。您的实体会被删除吗?
A better way would be to post a form to delete.
更好的方法是发布要删除的表单。
回答by Matthieu Napoli
There is a jQuery plugin that does just that: jquery.confirm.
有一个 jQuery 插件可以做到这一点:jquery.confirm。
Example:
例子:
<a href="home" class="confirm">Go to home</a>
JS code:
JS代码:
$('.confirm').confirm();
If the user confirms, he is redirected to the link of the <a>
, else nothing happens.
如果用户确认,他将被重定向到 的链接<a>
,否则什么也不会发生。
回答by Luisitox
You can use this: Download a bootboxjs from:[1]: http://bootboxjs.com/
您可以使用它:从以下位置下载 bootboxjs:[1]:http://bootboxjs.com/
Create the Button (HTML)
创建按钮 (HTML)
<button type="submit" id="btn">Delete</button>
Call the Dialog:
调用对话框:
var myBtn = document.getElementById('btn');
myBtn.addEventListener('click', function(event) {
bootbox.confirm({
size: "small",
message: "Are you sure?",
callback: function (result) {
/* result is a boolean; true = OK, false = Cancel*/
if (result == true) {
alert("ok pressed");
}
else {
alert("cancel pressed");
}
}
})
});