还记得之前的javascript入门里的讲的confirm 消息对话框吗？不记得也没关系，我们先来回顾一下，然后在详细讲它。

复习：

confirm 消息对话框通常用于允许用户做选择的动作，如：“你对吗？”等。弹出对话框(包括一个确定按钮和一个取消按钮)。

语法:

confirm(str);

参数说明:

str：在消息对话框中要显示的文本
返回值: Boolean值

返回值:

当用户点击"确定"按钮时，返回true
当用户点击"取消"按钮时，返回false

注: 通过返回值可以判断用户点击了什么按钮

看下面的代码:

<script type="text/javascript">

    var mymessage=confirm("你喜欢JavaScript吗?");

    if(mymessage==true)

    {   document.write("很好,加油!");   }

    else

    {  document.write("JS功能强大，要学习噢!");   }

</script>

结果:

注: 消息对话框是排它的，即用户在点击对话框按钮前，不能进行任何其它操作。

任务

使用confirm()提示框，当点击按钮时，完成性别确认。

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>confirm</title>

  <script type="text/javascript">

  function rec(){

    var mymessage=confirm("你是女士!");

    if(mymessage==true)

    {

        document.write("你是女士!");

    }

    else

    {

        document.write("你是男士!");

    }

  }

  </script>

</head>

<body>

    <input name="button" type="button" onClick="rec()" value="点击我，弹出确认对话框" />

</body>

</html>

结果：

延伸：

一.之前有说过，功能的话最好用函数来写，那样的话每一个函数都是一个功能，以后有用到这些功能的话，就可以直接用了。即复用。所以要习惯这样哦。。。。。。

就像上面那个例子

<script language="JavaScript">

function confirm (){

    var msg=confirm("你是女士!");

    if(msg==true)

    {

        document.write("你是女士!");

    }

    else

    {

        document.write("你是男士!");

    }

  }   

  </script>
然后给input调用函数，加个onClick="confirm ()"

注意：之前在博问里问过onclick="return confirm()"，onclick="confirm()"有什么不同，几个热心的网友回复了我，现在我总结一下：

confirm是有返回值的。然后onclick函数需要一个返回值，如果不是return confirm()，那么onclick接受到返回值就是undefined，那么表单本身的默认函数就会被触发。

如：
<form action="http://www.baidu.com">

    <button type="submit" onclick="confirm();">提交</button>

</form>

<form action="http://www.baidu.com">

    <button type="submit" onclick="return confirm();">提交</button>

</form> 

return false，会产生event.preventDefault()的效果，加上的话就不会出现表单点取消也被提交的情况了。

二.我们来对javascript window.confirm的方法做个小结

第一种：



就是上面我们提到的那种方法




<script language="JavaScript"> 

function confirm (){

    var msg=confirm("你是女士!");

    if(msg==true)

    {

        document.write("你是女士!");

    }

    else

    {

        document.write("你是男士!");

    }

  }   

  </script>






<input name="button" type="button" onClick="return confirm()" value="点击我，弹出确认对话框" />




注意：input ,buttton,form的的onclick()事件的方法前面需要加一个return ，想这样一样：onClick="return confirm ()"，以避免产生点击取消表单依然被提交的情况。


为了确保点击取消后，不做操作，最好给取消操作返回个false结果。


即：




<script language="JavaScript">

function confirm (){

    var msg=confirm("确定删除!");

    if(msg==true)

    {

        document.write("删除成功!");

    }

    else

{

        return false;

           }

  }

  </script>






<input name="button" type="button" onClick="return confirm ()" value="删除" />




第二种：


在标签中写：


1.




 <a href="javascript:if(confirm('确实要删除该内容吗?')) location='#'">删除</a>




2 .




 <a href="#" onclick= "if(confirm( '确实要删除该内容吗?')==false)return false; ">点击确定</a>




想简单点调用的话 也可以这样


代码如下:






<a href="#" onclick= "return confirm('确实要删除该内容吗?');">删除</a>




第三种：




<script language="JavaScript">

function del_confirm(e)

{

if (event.srcElement.outerText == "删除")

{

event.returnValue = confirm("删除是不可恢复的，你确认要删除吗？");

}

}

document.onclick = delete_confirm;

</script>






<a href="#" onClick="del_confirm">删除</a>




第四种：




<script language="JavaScript">

function del_confirm()

{

event.returnValue = confirm("删除是不可恢复的，你确认要删除吗？");

}

</script>






<a href="http://www.baidu.com" onClick="del_confirm()">删除</a>




二.如何将confirm 确定 取消 按钮替换成 是 否


1.confirm重写
2.用了vbscript来改写，暂时还没接触到vbscript，所以先放到一边，等以后有时间学习了回头看他。想知道如何实现的话就先参考下javascript JS 中confirm 确定 取消 按钮替换成 是 否 取消


三.js confirm换行详解


(1)




confirm('你好 \n world \n !');




(2)




confirm("你好\u000d world ") 




(3)




confirm("你好\r world ")




四.用jquery ui 实现类似cofirm功能


因为还没有接触到，所以先放到一边，等js学完了以后在回头看他。想知道如何实现的话就先参考一下这篇文章JQuery ui 实现类似于confirm的功能


注意：本文为原创，转载请以链接形式标明本文地址 ，谢谢合作。


本文地址：http://www.cnblogs.com/wanghuih/p/5592991.html




												


											
confirm确认对话框的更多相关文章
	

    
						
  1. jquery仿alert提示框、confirm确认对话框、prompt带输入的提示框插件[附实例演示]
		
    jquery仿alert提示框.confirm确认对话框.prompt带输入的提示框插件实例演示 第一步:引入所需要的jquery插件文件: http://www.angelweb.cn/Inc/eg ...
    
		
    2. 
						
  2. 关于abp中使用的sweetalert对话框组件的confirm确认对话框中的一个坑
		
    今天修改了一个功能,限制删除用户,在删除的时候不满足条件的时候提示用户原因,使用的sweet alert组件. abp框架前端集成了sweet alert 对http请求的error做了全局处理,我在 ...
    
		
    3. 
								
  3. Unity3d UGUI 通用Confirm确认对话框实现（Inventory Pro学习总结）
		
    背景 曾几何时,在Winform中,使用MessageBox对话框是如此happy,后来还有人封装了可以选择各种图标和带隐藏详情的MessageBox,现在Unity3d UGui就没有了这样的好事情 ...
    
		
    4. 
						
  4. asp.net在后台弹出confirm确认对话框并获取用户选择的值做出相应的操作
		
    在asp项目中,这种情况是经常出现的,前段时间通过查找资料以及自己尝试,找到一种解决方案,但是不知是否有更好的方案,以后发现再进行记录. 一.思路 在本次项目中,在一个函数中需要让用户判断,并根据用户 ...
    
		
    5. 
						
  5. BootstrapDialog.confirm确认对话框
		
    1. 依赖文件: bootstrap.js bootstrap-dialog.js bootstrap.css bootstrap-dialog.css 2.代码 BootstrapDialog.co ...
    
		
    6. 
						
  6. 确认(confirm 消息对话框)
		
    confirm 消息对话框通常用于允许用户做选择的动作(包括一个确定按钮和一个取消按钮). 语法: confirm(str) str:在消息对话框中要显示的文本 返回值: 当用户点击"确定& ...
    
		
    7. 
						
  7. javascript window.confirm确认 取消对话框实现代码小结
		
    本文章讲述的三种都是基于了javascript confirm提示确认框的做法了,只是在不同的地方写哦,有需要的同学可参考一下   confirm() 方法 confirm() 方法用于显示一个带有指 ...
    
		
    8. 
						
  8. 确认（confirm 消息对话框）语法：confirm(str); 消息对话框通常用于允许用户做选择的动作，如：“你对吗？”等。弹出对话框(包括一个确定按钮和一个取消按钮)
		
    确认(confirm 消息对话框) confirm 消息对话框通常用于允许用户做选择的动作,如:"你对吗?"等.弹出对话框(包括一个确定按钮和一个取消按钮). 语法: confir ...
    
		
    9. 
						
  9. 实现对gridview删除行时弹出确认对话框的一种简单方法
		
    在VS2008提供的GridView中我们可以直接添加一个CommandField删除列:<asp:CommandField ShowDeleteButton="True"  ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. poj3160 强连通+记忆化搜索
			
    题意:有一张 n 点 m 边的有向无环图,每个点有各自的权值,可正可负,现在从一个点开始走,一直走到不能走到其他点为止,每经过一个点,可以选择获得或不获得它的权值,每个点可以走多次,但是权值只能获得一 ...
    
			
    2. 
						
  2. 转--Eclipse中ctrl+shift+r与ctrl+shift+t的区别
			
    Eclipse中ctrl+shift+r与ctrl+shift+t的区别 标签: 快捷键工作区文件搜索打开资源文件 2016-09-13 15:44 292人阅读 评论(0) 收藏 举报  分类: e ...
    
			
    3. 
						
  3. jquery选择器之子元素
			
    HTML代码: :first-child 匹配第一个子元素,每个父元素的第一个子元素 :last-child 匹配最后一个子元素,每个父元素的最后一个子元素 <!DOCTYPE html> ...
    
			
    4. 
						
  4. Android stuido viewpagerindicator的使用
			
    Top Level Build.gradle buildscript { repositories { maven { url "http://dl.bintray.com/populov/ ...
    
			
    5. 
						
  5. IOS开发-代码规范
			
    代码风格的重要性对于一个团队和项目来说不言而喻.网上有许多 Objective-C 的代码风格,但这份简洁而又最符合苹果的规范,同时有助于养成良好的代码习惯,也是我们团队一直遵循的代码风格. 写法没有 ...
    
			
    6. 
						
  6. AttributeTargets 枚举
			
    AttributeUsage AttributeTargets 在C#的类中,有的类加上了[AttributeUsage(AttributeTargets.Property)]这个是起什么作用的呢?A ...
    
			
    7. 
						
  7. oracle判断某个字符在字段里出现过几次
			
    SELECT LENGTH(字段名)-LENGTH(REPLACE(字段名,'字符','')) FROM 表名;
    
			
    8. 
						
  8. [FFmpeg] ffmpeg参数详解
			
    ffmpeg 参数语法 ffmpeg [[options][`-i' input_file]]... {[options] output_file}... 如果没有输入文件,那么视音频捕捉就会起作用. ...
    
			
    9. 
						
  9. Linux卷配置管理
			
    [root@linux ~]# df -hFilesystem Size Used Avail Use% Mounted on/dev/sda3 19G 11G 6.5G 63% /tmpfs 995 ...
    
			
    10. 
						
  10. SimpleDateFormat做成员或者静态成员多线程安全隐患
			
    转自:http://blog.csdn.net/jeamking/article/details/7183958 有时我们在同一个类中都是使用同一种日期格式,又或者为了减少new SimpleDate ...
    
			
    11.