本文详细解析 JavaScript 中 confirm 函数的多种使用场景。涵盖基础语法、按钮属性绑定、链接点击确认、表单提交拦截及全局事件监听等五种常见实现方式,帮助开发者在删除、提交等关键操作中增加用户确认环节,防止误操作。
confirm 函数基础介绍
confirm 函数
confirm 函数主要用于提供用户确认功能。它首先展示包含在 message 参数中的信息,并提供“确定”和“取消”两个可选回答,随后等待用户做出选择。若用户点击“确定”,函数返回 true;若点击“取消”,则返回 false。该函数的基本语法格式如下:
window.confirm (message, ok, cancel)
该函数包含 3 个参数。其中,message 参数为需要显示的字符串提示信息;ok 参数用于显示确认按钮上的文本,可以是标准的“OK”,也可以是其他表达肯定含义的文本,例如“I Agree”或“I Like”等;同样,cancel 参数用于显示取消按钮上的文本,可以是“Cancel”,也可以是其他表达否定含义的字符串。
<script> var bln = window.confirm("确定吗?"); alert(bln) </script>
按钮属性绑定确认
或者
- Button.Attributes.Add("onclick", "javascript:if(!confirm('你确定要删除该系统咨询吗?')) { return false; }")
- Button.Attributes.Add("onclick","javascript:return confirm('请在登陆后运行,是否现在重新登陆?')")
例如:<a onclick="javascript:if(!confirm('确定要删除选择的信息吗?\n此操作不可以恢复!')) { return false; }" href="delhtml.asp?adid=<%=rs(" rel="external nofollow" adid")%>&type_oneid=<%=rs("type_oneid")%>"><font color="green">删除</font></a>
页面元素点击确认示例
示例:
以下代码放置在 <head></head> 标签内
<script>
function rusure()
{
question = confirm("确实要去进入吗?")
if (question !="0")
{
window.open("","测试公告窗口","width=340,height=163,toolbar=0,status=0,menubar=0,resize=0");
}
}
</script>
以下代码放置在 <body></body> 标签内
<a href="" onClick=" rel="external nofollow" rusure() ;return false;">来点击我</a>
表单提交与链接跳转确认
使用 confirm 确认提交动作,显示提交确认提示
例如在留言簿点击“重写”时,有时需要增加提示以防止误操作。代码如下:
方法一
<input name="Submit" type="submit" onClick="if(confirm('是否打开网页?')) location='http://www.05376.com'" value="打开">
方法二
<input name="Reset" type="reset" onClick="return clearbutton()" value="重写"> <script type="text/javascript"> function clearbutton() { if (!confirm("确定要重写吗?")) return false; } </script>
多种代码实现方式汇总
confirm() 方法用于显示一个带有指定消息以及确定和取消按钮的对话框。说明:如果用户点击确定按钮,confirm() 返回 true;如果点击取消按钮,则返回 false。第一种实现方式:
代码如下:
<a href="javascript:if(confirm('确实要删除该内容吗?'))location='http://www.baidu.com'" rel="external nofollow" >弹出窗口</a>
第二种方式:
代码如下:
<script language="JavaScript"> function delete_confirm(e) { if (event.srcElement.outerText == "删除") { event.returnValue = confirm("删除是不可恢复的,你确认要删除吗?"); } } document.onclick = delete_confirm; </script> <a href="Delete.aspx" rel="external nofollow" onClick="delete_confirm">删除</a>
第三种方式:
代码如下:
if(window.confirm('你确定要取消交易吗?')){ //alert("确定"); return true; }else{ //alert("取消"); return false; }
第四种方式:
代码如下:
<script language="JavaScript"> function delete_confirm() <!--调用方法--> { event.returnValue = confirm("删除是不可恢复的,你确认要删除吗?"); } </script>
简洁实现方法
这是我经常使用的一种更简单的方法:
代码如下:
<form name="form1" method="post" action="xxx.htm" onSubmit="javascript:return window.confirm('确认提交吗?')">
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持本站。