浅谈JavaScript中的对话框

JavaScript使用3种对话框:警告框,确认框和提示框;分别对应三个函数:alert()、confirm()、prompt()。这些对话框对于使我们的网站看起来更具吸引力非常有帮助。

警告框:alert()

网站中的警告框用于向用户显示警告消息,说明他们输入了错误的值,不是填写该位置所需的值。尽管如此,警报框仍然可以用于更友好的消息。警报框只提供一个按钮“确定”来选择并继续。

示例:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<script type="text/javascript">

function Warning() {

alert("警告,危险!");

}

</script>

</head>

<body>

<p>点击按钮</p>

<form>

<input type="button" value="点击这里" onclick="Warning();" />

</form>

</body>

</html>

效果图:

确认框:confirm()

如果您希望用户验证或接受某些内容,通常使用一个确认框。当确认框弹出时,用户必须单击“确定”或“取消”才能继续。如果用户单击“确定”按钮,window方法confirm()将返回true。如果用户单击“取消”按钮,则confirm()返回false并显示null。

示例:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<style>

body,input,p{

font-size: 25px;

}

</style>

<script type="text/javascript">

function Confirmation(){

              var Val = confirm("你想继续吗?");

              if( Val == true ){

                  document.write ("继续!");

                  return true;

              }

              else{

                  document.write ("不继续!");

                  return false;

              }

            }

</script>

</head>

<body>

<p>点击按钮</p>

<form>

<input type="button" value="点击这里" onclick="Confirmation();" />

</form>

</body>

</html>

效果图:

提示框:prompt()

如果希望用户在输入页面之前输入一个值,通常会使用一个提示框。当弹出提示框时,用户必须单击“确定”或“取消”才能继续输入值。如果用户单击“确定”按钮,window方法prompt()将从文本框返回输入的值。如果用户单击“取消”按钮,window方法prompt()将返回null。

例:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<style>

body,input,p{

font-size: 25px;

}

</style>

<script type="text/javascript">

function Value(){

                              var Val = prompt("输入你的姓名:", "name");

                              document.write("你输入的是: " + Val);

                      }

</script>

</head>

<body>

<p>点击按钮</p>

<form>

<input type="button" value="点击这里" onclick="Value();" />

</form>

</body>

</html>

效果图:

更多web前端开发知识,请查阅 HTML中文网 !!

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • JavaScript使用3种对话框:警告框,确认框和提示框;分别对应三个函数:alert()、confirm()、...
    yanghs阅读 487评论 0 1
  • 一、JS前言 (1)认识JS 也许你已经了解HTML标记(也称为结构),知道了CSS样式(也称为表示),会使用HT...
    凛0_0阅读 2,913评论 0 8
  • 事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放...
    孤魂草阅读 997评论 0 0
  • JavaScript对象本章目标(1) . 会使用getElementById( )方法访问DOM元素(2) ...
    拾起_518阅读 2,271评论 1 1
  •   ECMAScript 是 JavaScript 的核心,但如果要在 Web 中使用 JavaScript,那么...
    霜天晓阅读 951评论 0 0

友情链接更多精彩内容