prompt() 输入视窗

当网页执行 JavaScript 的 prompt() 方法时，网页就会弹出让用户“输入文字”的视窗，透过用户所输入的文字，进行接下来的动作，这篇教学会介绍两种呼叫 prompt() 打开输入视窗的方法。

onclick 撰写行内 JavaScript

在“HTML 元素属性”教学里，有介绍元素的“onclick”属性 ( 点击元素时触 )，只要在 onclick 属性里撰写行内的 JavaScript，点击元素就会执行 prompt() 方法，打开输入视窗，输入视窗的样式使用各个操作系统的默认样式，prompt() 基本写法如下：

prompt('提示文字');

以下面的网页程序码为例，不论点击 button 按钮或是 h2 标题，都会弹出输入视窗，并显示说明文字。

<button onclick="prompt('請輸入文字')">開啟輸入視窗</button>
<h2 onclick="prompt('請輸入文字');">開啟輸入視窗</h2>

通常使用 prompt() 会再额外搭配其他的程序，根据用户的所输入的内容对应的动作，因此可以将上述的程序码搭配 alert()，就能用警告视窗显示用户输入的内容

<button onclick="alert(prompt('請輸入內容'));">開啟輸入視窗</button>
<h2 onclick="alert(prompt('請輸入內容'));">開啟輸入視窗</h2>

onclick 搭配外部 JavaScript

使用 confirm 的方法比较适合搭配外部 JavaScript 撰写函数，透过 onclick 指定要执行的 JavaScript 函数，就能实现同样的效果。

<button onclick="myFunction();">開啟輸入視窗</button>
<h2 onclick="myFunction();">開啟輸入視窗</h2>

<script>
  var myFunction = function(){
    let answer = prompt('請輸入內容');
    alert(answer);
  }
</script>

其他打开弹出视窗的方法

• alert() 警告视窗
• confirm() 确认视窗

意见反馈