首頁 > web前端 > js教程 > 用JavaScript實作對話框的教學_基礎知識

用JavaScript實作對話框的教學_基礎知識

WBOY
發布: 2016-05-16 15:56:50
原創
2250 人瀏覽過

 JavaScript支援三種重要類型的對話方塊。這些對話框可以用來引發和警報,或得到確認的任何輸入或有來自使用者的一種輸入。

在這裡,我們將一個一個來看每個對話框:
Alert 對話框:

一個警告對話框,主要是用來給一個警告訊息給使用者。就像如果一個輸入欄位要求輸入一些文字,但使用者不輸入欄位則作為驗證,可以使用警告框,如下給出警告訊息的一部分:

<head>
<script type="text/javascript">
<!--
  alert("Warning Message");
//-->
</script>
</head>

登入後複製

然而,一個警告框仍然可以用於友善的訊息。警告框,給人只有一個“Ok”按鈕來選擇和繼續。

 
確認對話框:

一個確認對話框主要用來把使用者的同意的任何選項。它顯示一個對話框,有兩個按鈕:確定和取消。

如果使用者點選OK按鈕,視窗的方法confirm()將會回傳true。如果使用者點擊取消按鈕confirm() 返回 false。可以使用確認對話框,如下圖所示:

<head>
<script type="text/javascript">
<!--
  var retVal = confirm("Do you want to continue &#63;");
  if( retVal == true ){
   alert("User wants to continue!");
  return true;
  }else{
   alert("User does not want to continue!");
  return false;
  }
//-->
</script>
</head>

登入後複製

 
Prompt Dialog Box:

當你想要彈出一個文字方塊來取得使用者輸入的提示對話框中是非常有用的。因此,它使您能夠與用戶互動。用戶需要填寫字段,然後按一下確定。

使用對話方塊 prompt() 是一種方法,它有兩個參數(I)要在文字方塊中顯示(Ⅱ)預設字串文字方塊中顯示的標籤顯示。

這個對話框有兩個按鈕:確定和取消。如果使用者點選「OK」按鈕的視窗法prompt()將從文字方塊傳回輸入的值。如果使用者點擊「取消」按鈕視窗方式prompt()返回null。

可以使用提示對話框,如下圖:

<head>
<script type="text/javascript">
<!--
  var retVal = prompt("Enter your name : ", "your name here");
  alert("You have entered : " + retVal );
//-->
</script>
</head>

登入後複製

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板