Alert, Confirm, and Prompt

Alert, Confirm, and Prompt

---

範例：在本範例中，我們介紹三個最常用的對話視窗。其中，我們曾經介紹過 alert() 以及 prompt()。在操作這個範例時，如果出現"取消"按鈕，請記得也 點選它，並觀察結果有何不同。如果你想不斷重複操作，你只需要在瀏覽器上點選 "重載"即可。

---

原始碼：

<script language="javascript">


function getinput()
{
  var res;
  var conf;
  var res = prompt("Please enter your name.", "");

  if (res != null)
  {
    if (res != "")
    {
      conf = confirm("Your name is " + res);
      if (conf == true) 
        document.write("Welcome, " + res);
      else
        document.write("See you next time.");
    }
    else
      document.write("Hello whoever you are.");
  }
  else // if Cancel was clicked
  {
    document.write("See you next time.");
  }
}

getinput();

</script>

---

說明：

• 就像前一個範例所說明的，alert("text") 會將參數內的字串顯示在對話視窗 中，而且該對話視窗只有一個"確定"按鈕。
• 在 getinput() 中，首先執行 prompt() 來取得使用者輸入的姓名。之前，我們 已經介紹過 prompt() 的用法，我們在這裡只針對之前沒說明過的再進一步解釋。 在 prompt 對話視窗中，會出現兩個按鈕，一個是"確定"，而另一個是"取消"。 不知道，你們是否想過：如果使用者不小心（或者故意）點選"取消"按鈕，程式 會不會產生一些莫名奇妙的結果？在之前的說明，我們知道如果使用者點選"確定"， 那麼 prompt() 會把文字欄位中的資料回傳；反之，如果使用者點選"取消"， 那麼 prompt() 會回傳 null（null 是保留字，代表什麼都沒有，不是 null 字串）。最後，還有一個問題：如果使用者什麼也沒有輸入就點選了"確定"， 什麼物件會被回傳呢？這個問題的答案是"空字串"；請注意，空字串和 null 是不 一樣的，空字串還是一個物件，而 null 卻沒有物件。
• 經過了前一項的說明，我們來解釋 prompt() 之後的 if 敘述：如果使用者 在 prompt 視窗點選了"取消"，由於 res 被設定成 null，因此 else 的區塊會被 執行，而出現 See you next time.。如果使用者什麼也沒有輸入就點選了"確定"， 則 res 是空字串（""），則出現 Hello whoever you are.。最後一種情形就是 使用者輸入了一些資料並點選"確定"，則程式執行 confirm() 函數。
• confirm("text") 跟 alert("text") 類似，都會把參數內的字串顯示在 對話視窗中；但是跟 alert() 不同的地方在於 confirm 視窗會同時出現 "確定"和"取消"按鈕。在 confirm 視窗，如果使用者點選"確定"按鈕，則 confirm() 回傳 true；反之，confirm() 回傳 false。
• 接續之前的說明：假設使用者輸入 Eric 並點選"確定"，則程式執行 confirm()。 首先，Your name is Eric 會顯示在 confirm 視窗；這時，如果使用者 點選"確定"，則網頁出現 Welcome, Eric；否則，網頁出現 See you next time.。

---