JS警告框 alert()、confirm()、prompt()的区别

合集下载

Dialog和alert和confirm对象用法

alert的用法javascript

alert的用法javascript【原创实用版】目录1.什么是 JavaScript 中的 alert() 函数2.alert() 函数的基本用法3.alert() 函数的参数4.alert() 函数的实例正文1.什么是 JavaScript 中的 alert() 函数在 JavaScript 中，alert() 函数是一种用于弹出警告框的函数，它可以在网页中显示一段消息或者提示用户。

当用户点击“确定”按钮后，警告框会自动关闭。

2.alert() 函数的基本用法alert() 函数的基本用法非常简单，只需要在函数中加入要显示的文本即可。

下面是一个简单的示例：```javascriptalert("欢迎来到我的网站！");```当这段代码在浏览器中运行时，会弹出一个警告框，显示“欢迎来到我的网站！”。

3.alert() 函数的参数除了基本的文本参数之外，alert() 函数还可以接受一个可选的数字参数，表示警告框显示的时间（以毫秒为单位）。

例如：```javascriptalert("欢迎来到我的网站！", 3000);```这段代码会弹出一个警告框，显示“欢迎来到我的网站！”，并在 3 秒（3000 毫秒）后自动关闭。

4.alert() 函数的实例下面是一个完整的 HTML 页面，其中包含一个使用 alert() 函数的JavaScript 实例：```html<!DOCTYPE html><html><head><title>JavaScript alert() 函数示例</title><script>function showAlert() {alert("欢迎来到我的网站！");}</script></head><body><h1>欢迎来到我的网站！</h1><p>点击下面的按钮查看警告框：</p><button onclick="showAlert()">查看警告框</button></body></html>```当用户点击“查看警告框”按钮时，会弹出一个警告框，显示“欢迎来到我的网站！”。

JavaScript中常用的3种弹出提示框（alert、confirm、prompt）

JavaScript中常⽤的3种弹出提⽰框（alert、confirm、prompt）⽬录alert ()confirm()prompt ()总结三种提⽰框alert ()confirm()prompt ()alert ()alert()⽅法是显⽰⼀条弹出提⽰消息和确认按钮的警告框。

需要注意的是：alert()是⼀个阻塞的函数，如果我们不点确认按钮，后⾯的内容就不会加载出来。

使⽤⽅式：alert("想要提⽰的⽂本内容")样例代码：<!DOCTYPE html><html><head><meta charset="utf-8"><script>alert("这是弹出框提⽰⽂本")</script><title></title></head><body><p>alert是阻塞的函数</p><p>这句话只有在确认弹出框的提⽰⽂本后才会显⽰</p></body></html>效果截图：confirm()confirm()⽅法是显⽰⼀个含有指定消息和确认和取消按钮的确认框。

如果点击"确定"返回true，否则返回false。

使⽤⽅式：不接收返回值：confirm("这样写可以直接显⽰,不接收返回值。

")接收返回值：var x;var r=confirm("请按下按钮!");if (r==true){x="你按下的是\"确定\"按钮。

";}else{x="你按下的是\"取消\"按钮。

";}document.write(x)样例代码：<!DOCTYPE html><html><head><meta charset="utf-8"><script>// 使⽤⽅式⼀confirm("这样写可以直接显⽰,不接收返回值。

jquery仿alert提示框、confirm确认对话框、prompt带输入的提示框插件[。。。

jquery仿alert提⽰框、confirm确认对话框、prompt带输⼊的提⽰框插件[。

第⼀步：引⼊所需要的jquery插件⽂件：第⼆步：引⼊所需的样式：#popup_container {font-family: Arial, sans-serif;font-size: 12px;min-width: 300px;max-width: 600px;background:#FFF;border:solid 5px #999;color:#000;-moz-border-radius:5px;-webkit-border-radius: 5px;border-radius: 5px;}#popup_title {font-size:14px;font-weight:bold;text-align:center;line-height:1.75em;color:#666;background: #CCC url(/images/eg/title.gif) top repeat-x;border: solid 1px #FFF;border-bottom: solid 1px #999;cursor: default;padding:0em;margin:0em aut #popup_content {background:16px 16px no-repeat url(/images/eg/info.gif);padding: 1em 1.75em;margin: 0em;}#popup_content.alert {background-image: url(/images/eg/info.gif);}#popup_content.confirm {background-image: url(/images/eg/important.gif);}#popup_content.prompt {background-image: url(/images/eg/help.gif);}#popup_message {padding-left: 48px;}#popup_panel {text-align: center;margin:1em 0em 0em 1em;}#popup_prompt {margin:.5em 0em;}注意把上⾯样式中的图⽚先保存到本地，然后替换成⾃⼰的路径！第三步：就可以直接引⽤了，看下⾯简单的实例：$("#alert_button").click( function() {jAlert('这是⼀个可⾃定义样式的警告对话框', '警告对话框');});$("#confirm_button").click( function(){jConfirm('你确定这么做吗?', '确认对话框',function(r){jAlert('是否确定 ' + r, '确定内容');});});$("#prompt_button").click( function(){jPrompt('输⼊字符:', '这⾥是默认值', '带输⼊框的提⽰框', function(r) {if( r ){alert('你输⼊的是 ' + r)};});});<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><title>zhezhaoceng.html</title><meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="this is my page"><meta http-equiv="content-type" content="text/html; charset=UTF-8"><script type="text/javascript" src="<%=contextPath %>/core/js/jquery/jquery-1.4.2.js"></script><script type="text/javascript" src="jquery.alerts.js"></script><style>#popup_container {font-family: Arial, sans-serif;font-size: 12px;min-width: 300px;max-width: 600px;background:#FFF;border:solid 5px #999;color:#000;-moz-border-radius:5px;-webkit-border-radius: 5px;border-radius: 5px;}#popup_title {font-size:14px;font-weight:bold;text-align:center;line-height:1.75em;color:#666;background: #CCC url(/images/eg/title.gif) top repeat-x;border: solid 1px #FFF;border-bottom: solid 1px #999;cursor: default;padding:0em;margin#popup_content {background:16px 16px no-repeat url(/images/eg/info.gif);padding: 1em 1.75em;margin: 0em;}#popup_content.alert {background-image: url(/images/eg/info.gif);}#popup_content.confirm {background-image: url(/images/eg/important.gif);}#popup_content.prompt {background-image: url(/images/eg/help.gif);}#popup_message {padding-left: 48px;}#popup_panel {text-align: center;margin:1em 0em 0em 1em;}#popup_prompt {margin:.5em 0em;}</style><script type="text/javascript">$("#alert_button").click( function() {jAlert('这是⼀个可⾃定义样式的警告对话框', '警告对话框');});$("#confirm_button").click( function(){jConfirm('你确定这么做吗?', '确认对话框',function(r){jAlert('是否确定 ' + r, '确定内容');});});$("#prompt_button").click( function(){jPrompt('输⼊字符:', '这⾥是默认值', '带输⼊框的提⽰框', function(r) {if( r ){alert('你输⼊的是 ' + r)};});});</script></head><body><div id="Con" class="ConDiv"><fieldset><legend>警告提⽰框（Alert）</legend><pre> $("#alert_button").click( function() {jAlert('这是⼀个可⾃定义样式的警告对话框', '警告对话框');});</pre><p><input id="alert_button" type="button" value="警告提⽰框"></p></fieldset><script language="javascript">$(function(){$("#alert_button").click( function() {jAlert('这是⼀个可⾃定义样式的警告对话框', '警告对话框');});});</script><fieldset><legend>确认对话框（Confirm）</legend><pre> $("#confirm_button").click( function(){jConfirm('你确定这么做吗?', '确认对话框',function(r){jAlert('是否确定 ' + r, '确定内容');});});</pre><p><input id="confirm_button" type="button" value="确认对话框"></p></fieldset><script language="javascript">$(function(){$("#confirm_button").click( function(){jConfirm('你确定这么做吗?', '确认对话框',function(r){jAlert('是否确定 ' + r, '确定内容');});});});</script><fieldset><legend>带输⼊的提⽰框（Prompt）</legend><pre> jPrompt('输⼊字符:', '这⾥是默认值', '带输⼊框的提⽰框', function(r) {if( r ) alert('你输⼊的是 ' + r);});</pre><p><input id="prompt_button" type="button" value="带输⼊框的提⽰框"></p></fieldset><script language="javascript">$(function(){$("#prompt_button").click( function(){jPrompt('输⼊字符:', '这⾥是默认值', '带输⼊框的提⽰框', function(r) {if( r ){alert('你输⼊的是 ' + r)};});});});</script><fieldset><legend>带HTML输出效果的对话框</legend><pre> jAlert('你可以使⽤HTML标签，⽐如<strong>加粗</strong>, <em>斜体</em>，和<u>下划线</u>!');</pre><p><input id="alert_button_with_html" type="button" value="显⽰带有HTML标签效果的弹出框"></p></fieldset><script language="javascript">$(function(){$("#alert_button_with_html").click( function(){jAlert('你可以使⽤HTML标签，⽐如 <strong>加粗</strong>, <em>斜体</em>，和 <u>下划线</u>!');});});</script></div></body></html>。

jsalert()、confirm()、prompt()的区别

jsalert()、confirm()、prompt()的区别使用消息框使用警告、提示和确认可以使用警告、确认和提示消息框来获得用户的输入。

这些消息框是window 对象的接口方法。

由于window 对象位于对象层次的顶层，因此实际应用中不必使用这些消息框的全名（例如"window.alert()"），不过采用全名是一个好注意，这样有助于您记住这些消息框属于哪个对象。

警告消息框alert 方法有一个参数，即希望对用户显示的文本字符串。

该字符串不是HTML 格式。

该消息框提供了一个“确定”按钮让用户关闭该消息框，并且该消息框是模式对话框，也就是说，用户必须先关闭该消息框然后才能继续进行操作。

window.alert("欢迎！请按“确定”继续。

");确认消息框使用确认消息框可向用户问一个“是-或-否”问题，并且用户可以选择单击“确定”按钮或者单击“取消”按钮。

confirm 方法的返回值为true 或false。

该消息框也是模式对话框：用户必须在响应该对话框（单击一个按钮）将其关闭后，才能进行下一步操作。

var truthBeTold = window.confirm("单击“确定”继续。

单击“取消”停止。

");if (truthBeTold) {window.alert("欢迎访问我们的Web 页！");} else window.alert("再见啦！");提示消息框提示消息框提供了一个文本字段，用户可以在此字段输入一个答案来响应您的提示。

该消息框有一个“确定”按钮和一个“取消”按钮。

如果您提供了一个辅助字符串参数，则提示消息框将在文本字段显示该辅助字符串作为默认响应。

否则，默认文本为""。

与alert( ) 和confirm( ) 方法类似，prompt 方法也将显示一个模式消息框。

js中prompt()的用法

js中prompt()的用法prompt()是JavaScript中的一种方法，用于与用户交互并获取用户输入。

它弹出一个对话框，其中包含一个消息和一个输入框，提示用户输入内容。

通常情况下，prompt() 方法用于与用户交互，例如获取用户名或密码，或要求用户输入某些数据。

prompt() 方法的语法如下：```prompt(message, default);```message：要显示的消息，通常是一些提示性文字。

default：可选参数，即在输入框中默认显示的文本。

如果用户没有输入任何内容，将返回该值。

例如，下面的代码将提示用户输入他们的名字，并将输入的值存储在变量 name 中：```var name = prompt('请输入你的名字：', '匿名用户');```如果用户输入了他们的名字，则该值将存储在 name 变量中，否则将存储 '匿名用户'。

需要注意的是，prompt() 的返回值始终是一个字符串，无论用户输入的是数字、布尔值还是其他内容。

另外，可以将 prompt() 与条件语句和循环语句等进行结合使用，以便对用户输入的内容进行处理和验证。

例如，下面的代码将提示用户输入他们的年龄，如果年龄小于 18，则弹出警告，并要求重新输入。

如果年龄大于或等于 18，则存储该值并显示欢迎消息。

```var age;do {age = prompt('请输入你的年龄：', '');} while (isNaN(age) || age < 18);alert('欢迎您，您的年龄是 ' + age + ' 岁！');```在上面的代码中，isNaN() 函数用于检查用户输入的是否为数字。

如果不是数字，则会在循环中继续提示用户输入，直到输入正确为止。

一旦输入的年龄大于或等于 18，则弹出欢迎消息，程序执行结束。

jsconfirm用法

jsconfirm用法jsconfirm是一种常用的JavaScript弹窗消息框，它用于确认用户的操作和输入。

它可以通过一个简单的弹窗形式完成对用户操作或输入的确认，这种方式非常实用，尤其是在需要提示用户确认情况下。

jsconfirm有三个常用的用法：1.认网站用户操作当网站用户需要完成某个操作时，jsconfirm可用于弹出一个确认框，让用户确认自己的操作是否正确，从而减少误操作的可能性。

比如在删除用户账号的操作中，可以使用jsconfirm弹出一个确认提示，让用户在操作之前再次确认自己的操作，从而避免误操作。

2.认用户输入在收集用户信息的网页或表单中，jsconfirm可用于确认用户输入的内容是否正确。

比如在收集用户的电子邮箱信息时，可以通过jsconfirm弹出一个确认框，让用户在提交表单之前再次确认输入的邮箱信息是否正确，从而减少用户输入错误的可能性。

3.加用户访问控制此外，jsconfirm也可以用于添加用户访问权限控制，比如当用户需要访问一些比较敏感的页面时，可以弹出一个jsconfirm确认框，让用户在访问该页面之前重新确认自己的操作，从而增加对用户访问的安全性。

jsconfirm的使用非常简单，只需要在JavaScript脚本中使用confirm()函数即可实现。

具体的实现代码如下所示：<script type=text/javascriptif(confirm(确认执行此操作？{//执行代码}else{//取消代码}</script>以上就是jsconfirm的用法，它的使用非常方便和实用，可以有效地降低用户操作和输入的误差。

javascript－－弹出对话框四种对话框获得用户输入值

javascript－－弹出对话框四种对话框获得用户输入值javascript－－弹出对话框四种对话框获得用户输入值让用户点击确定取消。

让用户输入值。

打开指定窗口alert("message") confirm("message") prompt("message") open("url")首先我想先说两句我对javascript的一些看法，我希望大家认真的去学习这门编程语言，因为它给我们在开发网页时，会带来很多的惊喜！javascript一般是运行在客户端的(client)，主要用于开发一些网页中的动态效果，其实它的用处还有很多，比如验证表单内容，以及现在比较流行的ＡＪＡＸ应用．今天主要写一下javascript中的弹出对话框：第一种：alert("message")第二种：confirm("message")第三钟：prompt("message")第四种：open("url")第一种alert对话框是一个最简单，也是最常用的一个弹出对话框，通常用于提示信息，对话框包含一个按钮，单击对话框中的按钮将会关闭此对话框．第二种confirm对话框返回的是一个布尔值，该对话框一般用于用户选择，该对话框包含两个按钮，一般一个是＂确认＂，另一个是＂取消＂,比如我们在开发程序的时候，创建一个删除按钮，为了防止用户务操作，一般就会用到这个对话框：＂您确定删除吗？＂如果选择＂确定＂，执行删除，如果选择＂取消＂，则返回，不做任何操作！第三种prompt对话框，主要用户获取用户输入的信息，比如，弹出一个对话框:<script language="javascript">var name=prompt("你的名字叫什么?");document.write(name);</script>prompt对话框包括两个按钮（＂确认＂和＂取消＂）和一个文本框，文本框用来获取用户输入的信息．第四种其实是一种用对话框的方式打开一个网页,open方法包含很多的参数，主要是用户设置浏览器的显示外观：window.open("Webpage.asp?",Derek,"height=100,width=10 0,status=yes,toolbar=yes,menubar=no,location=no");此语句打开一个新窗口，页面为webpage.asp，参数为var，名字为Derek，高为100，宽为100，显示状态栏和工具条，不显示菜单和地址。

1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。

使用消息框
使用警告、提示和确认
可以使用警告、确认和提示消息框来获得用户的输入。

这些消息框是 window 对象的接口方法。

由于 window 对象位于对象层次的顶层，因此实际应用中不必使用这些消息框的全名（例如 "window.alert()"），不过采用全名是一个好注意，这样有助于您记住这些消息框属于哪个对象。

警告消息框
alert 方法有一个参数，即希望对用户显示的文本字符串。

该字符串不是 HTML 格式。

该消息框提供了一个“确定”按钮让用户关闭该消息框，并且该消息框是模式对话框，也就是说，用户必须先关闭该消息框然后才能继续进行操作。

window.alert("欢迎！请按“确定”继续。

");
确认消息框
使用确认消息框可向用户问一个“是-或-否”问题，并且用户可以选择单击“确定”按钮或者单击“取消”按钮。

confirm 方法的返回值为 true 或 false。

该消息框也是模式对话框：用户必须在响应该对话框（单击一个按钮）将其关闭后，才能进行下一步操作。

var truthBeTold = window.confirm("单击“确定”继续。

单击“取消”停止。

");
if (truthBeTold) {
window.alert("欢迎访问我们的 Web 页！");
} else window.alert("再见啦！");
提示消息框
提示消息框提供了一个文本字段，用户可以在此字段输入一个答案来响应您的提示。

该消息框有一个“确定”按钮和一个“取消”按钮。

如果您提供了一个辅助字符串参数，则提示消息框将在文本字段显示该辅助字符串作为默认响应。

否则，默认文本为 "<undefined>"。

与alert( ) 和 confirm( ) 方法类似，prompt 方法也将显示一个模式消息框。

用户在继续操作之前必须先关闭该消息框
var theResponse = window.prompt("欢迎？","请在此输入您的姓名。

");
用confirm来做删除确认可以这样做：
<a href="#" onclick= "if(confirm( '是否确认删除！ ')==false)return false; ">删除</a>。