JavaScriptでダイアログボックスをポップアップ表示する方法

藏色散人
リリース: 2023-01-05 16:14:26
オリジナル
8522 人が閲覧しました

JavaScript ポップアップ ダイアログ ボックスを実装する方法: 1.alert() メソッドを使用してダイアログ ボックスを設定します; 2.confirm() メソッドを使用してダイアログ ボックスを設定します; 3. 以下を使用してプロンプト ボックスを設定しますプロンプト() メソッド。

JavaScriptでダイアログボックスをポップアップ表示する方法

この記事の動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

JavaScript の 3 つのポップアップ ダイアログ ボックス

js を勉強した友人なら、alert() メソッドと、場合によっては prompt() メソッドを使用していることに気づくでしょう。 、prompt() メソッド、どちらも画面上にダイアログ ボックスをポップアップ表示し、その上に括弧内のコンテンツを表示します。このメソッドを使用すると、ページの対話性がより刺激的になります。実際、このタイプのダイアログ ボックスは、単にユーザーとアプリケーション間の双方向通信に使用されます。 avascriptの3つのダイアログボックスは、windowオブジェクトのalert()、confirm()、prompt()の3つのメソッドを呼び出すことで得られ、これらのダイアログボックスを利用することでjsの入出力を完結させ、jsと対話可能なjsを実現することができます。ユーザーコード。今日は、エディターが js の 3 つのポップアップ ダイアログ ボックスを簡単に紹介します。エディターは、最初にこれらのメソッドを個別に詳しく説明し、次にこれらのメソッドを比較します。さて、js の旅を始めましょう。`(*∩_∩*) ''....
最初のメソッド:alert() メソッド
alter() メソッドは次の 3 つのダイアログです。ボックス内で最も簡単に使用できるメソッドです。 , ダイアログ ボックス内のalert() 括弧内のテキスト情報を簡単かつ明確に表示するために使用できます。これをアラート ダイアログ ボックスと呼びます。表示される情報は括弧内に配置されます。ダイアログ ボックスには確認ボタンが含まれていますユーザーは、表示された情報を読み終えた後、クリックするだけでダイアログ ボックスを閉じることができます。
アラート() メソッドの使用例を見てみましょう。コードは次のとおりです:

<html>
<head>
<title>编写html页面</title>
<script language="javascript"> //JavaScript脚本标注
alert("上联:山石岩下古木枯");//在页面上弹出上联
alert("下联:白水泉边少女妙");//在页面上弹出下联
</script>
</head>
</html>
ログイン後にコピー

上記の小さな例を実行すると、ポップアップが表示されます。ページ上のダイアログをフレーム化して、以下に示すように「1 行目: 岩と岩の下で枯れた古代の木々」という文を表示します。

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

# ページ上にダイアログ ボックスが表示され、「上連: 岩の下にある古代の木」という文が表示されます。「確認」ボタンをクリックすると、2 番目のダイアログ ボックスが表示され、「白い泉の横にいる少女はこの小さな例を分析してみましょう:

a.

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>
ログイン後にコピー

       显示效果如下:

       

       分析一下这个小例子:
       a、在

人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート