JavaScript_javascript のヒントでダイアログボックスをポップアップする 3 つの方法-jsチュートリアル-php.cn

JS を勉強したことのある友人は、alert() メソッド、prompt() メソッド、prompt() メソッドを場合によっては画面上にポップアップ表示し、その上に括弧を表示していることに気づくでしょう。この方法を使用すると、内部のコンテンツがよりエキサイティングなページになります。実際、ダイアログボックスは、ユーザーがアプリケーションと双方向通信するときによく使用されます。

JavaScript の 3 つのダイアログボックスは、ウィンドウオブジェクトの 3 つのメソッド、alert()、confirm()、prompt() を呼び出すことによって取得されます。これらのダイアログボックスは、入力と出力を完了するために使用できます。 js の、ユーザーと対話できる js コードを実装します。

今日は、エディターが js の 3 つのポップアップダイアログボックスを簡単に紹介します。エディターは、まずこれらのメソッドを個別に詳しく説明し、次にこれらのメソッドを比較します。それでは、js を始めましょう`( *∩_∩*)'......

最初:alert() メソッド

これらの 3 つのダイアログボックスの中で、alert() メソッドは最も簡単に使用でき、ダイアログボックス内のalert() 括弧内のテキスト情報を簡単かつ明確に表示します。ダイアログボックスには、表示される情報が括弧内に配置されています。ユーザーは、表示された情報を読み終えた後、ボタンをクリックするだけでダイアログボックスを閉じます。 alert() メソッドの使用例を見てみましょう。コードは次のとおりです。

<html>
<head>
<title>编写html页面</title>
<script language="javascript"> //JavaScript脚本标注
alert("上联：山石岩下古木枯");//在页面上弹出上联
alert("下联：白水泉边少女妙");//在页面上弹出下联
</script>
</head>
</html>

ログイン後にコピー

上記の小さな例を実行すると、ページ上にダイアログボックスが表示され、以下に示すように「Shanglian: 古代の木々は岩や岩の下で枯れています」という文が表示されます。

次に、「確認」ボタンをクリックすると、2 番目のダイアログボックスが表示され、「白い泉の隣の女の子は素晴らしいです!」という効果が次のように表示されます。

ページ上にダイアログボックスが表示され、「最初の対句: 岩の下で枯れた古代の木々」という文が表示されます。「確認」ボタンをクリックすると、2 番目のダイアログボックスが表示され、「白い水の泉のそばにいる少女」と表示されます。素晴らしいです!」それを分析してみましょう。ここに小さな例を示します:

a.
で、alert() メソッドを呼び出します。

b. 各alert()括弧内にテキスト情報を追加します。実行すると、次のページが表示されます。ページ上の「OK」ボタンをマウスでクリックすると、2番目のページが表示されます。「OK」ボタンをクリックしてページ上のダイアログボックスを閉じます。注: 2 つのダイアログボックスは、一方が他方を覆うのではなく、別々に表示されます。これは、js が実際に最初のalert() を実行し、ユーザーが 2 番目のalert() を実行するまで「確認」ボタンがクリックされるまで待機するためです。

alert() は、js window オブジェクトのメソッドであり、呼び出すと、window.alert() またはalert() として記述でき、その機能は、情報を表示する確認ボタン付きのダイアログボックスを生成することです。括弧内は、

2 番目:confirm() メソッド

confirm() メソッドは、alert() メソッドとよく似ていますが、このタイプのダイアログボックスには「確認」ボタンに加えて「キャンセル」ボタンもあります。ダイアログボックスでは、window オブジェクトのconfirm()メソッドと後で紹介するprompt()メソッドを呼び出すときに、windowを記述する必要はありません。 confirm() に関する小さな例を見てみましょう。コードは次のとおりです。

表示効果は次のとおりです:

<html>
<head>
<title>编写html页面</title>
<script language="javascript"> //js脚本标注
confirm("上联：一但重泥拦子路；下联：两岸夫子笑颜回"); //在页面上弹出确认对话框
</script>
</head>
</html>

ログイン後にコピー

この小さな例を分析してください: