JS常用对话框实现与操作汇总:提示、确认与输入
版权申诉
109 浏览量
更新于2024-09-11
收藏 75KB PDF 举报
本文主要介绍了JavaScript中三种最常见的弹出对话框实现方法,包括:
1. **提示对话框(Alert)**:使用`alert()`函数来显示一段消息,例如`function ale() { alert("提示信息!"); }`。这种方法用于简单的信息展示,没有用户交互,消息出现后会自动消失。
2. **确认对话框(Confirm)**:通过`confirm()`函数展示一个带有“确定”和“取消”按钮的对话框,用户选择确定时执行特定操作,如`function firm() { if (confirm("你确定提交吗?")) { alert("点击了确定"); } else { alert("点击了取消"); } }`。这个对话框会返回用户的选择(true或false),可以根据返回值执行后续逻辑。
3. **输入对话框(Prompt)**:使用`prompt()`函数获取用户的输入,如`function prom() { var name = prompt("请输入您的名字", ""); if (name) { alert("欢迎您:" + name); } }`。此函数会暂停脚本执行,直到用户输入完毕,然后返回输入的文本。
文章还提到了在HTML按钮上使用`onclick`属性与JavaScript交互来触发不同的对话框:
- **删除按钮提示确认**:点击后弹出一个包含“是”和“否”选项的确认对话框,如`<input type="button" onclick="return confirm('Yes/No');" value="删除">`。
- **提示信息按钮**:点击后立即显示一条消息,不等待用户确认,使用`onclick="alert('您确定要删除吗?');"`。
- **提交按钮**:点击后跳转到指定链接,如`<input type="button" onclick="window.location.href='http://www.baidu.com';" value="提交">`。
- **关闭按钮**:点击后关闭当前窗口,使用`onclick="window.close();"`。
- **返回并关闭连接**:点击后关闭当前页面并跳转到另一个链接,但具体实现代码缺失,可能是`<a href="#" onclick="javascript:..."`的格式。
这些例子展示了如何根据需求在JavaScript中控制页面行为,引导用户交互,并提供必要的反馈。理解并熟练掌握这些基本的对话框和按钮功能是前端开发的基础技能之一。
点击了解资源详情
点击了解资源详情
点击了解资源详情
2016-08-26 上传
2020-12-10 上传
2010-07-17 上传
2019-11-10 上传
2012-10-26 上传
2020-10-29 上传
weixin_38624315
- 粉丝: 7
- 资源: 919
最新资源
- 深入浅出:自定义 Grunt 任务的实践指南
- 网络物理突变工具的多点路径规划实现与分析
- multifeed: 实现多作者间的超核心共享与同步技术
- C++商品交易系统实习项目详细要求
- macOS系统Python模块whl包安装教程
- 掌握fullstackJS:构建React框架与快速开发应用
- React-Purify: 实现React组件纯净方法的工具介绍
- deck.js:构建现代HTML演示的JavaScript库
- nunn:现代C++17实现的机器学习库开源项目
- Python安装包 Acquisition-4.12-cp35-cp35m-win_amd64.whl.zip 使用说明
- Amaranthus-tuberculatus基因组分析脚本集
- Ubuntu 12.04下Realtek RTL8821AE驱动的向后移植指南
- 掌握Jest环境下的最新jsdom功能
- CAGI Toolkit:开源Asterisk PBX的AGI应用开发
- MyDropDemo: 体验QGraphicsView的拖放功能
- 远程FPGA平台上的Quartus II17.1 LCD色块闪烁现象解析