0

相互に関連する3つの依存ドロップダウンを作成する必要があります。したがって、最初のドロップダウンを選択すると、関連データが2番目のドロップダウンに表示され、2番目のドロップダウンでオプションを選択すると、3番目のドロップダウンにいくつかの関連データが表示されます。

そして、このフォームで$ _GETを使用する必要があるため、2番目のオプションが選択された場合、マッサージが表示され、オプションが3番目のドロップダウンが選択された場合、ページはたとえばwww.google.comにリダイレクトされます。 。そして、最初に提出された2つの関連のないデータが必要なので、それらが選択されると、ページは例としてwww.msn.comにリダイレクトされます。

JavaScriptが必要なことは知っていますが、残念ながら今のところJSはわかりません。

また、JavaScriptにパラメータを送信するために「this.value」を使用しないでください。他のコードの1つと競合するためです。

（そして、ページをリロードしたくありません）

このようなもの ：

Drop down 1  ----------------------- drop down 2  ----------------------- drop down 3

option 1 ( redirect to msn.com)

option 2 ==========================> Option 100 ======================> Option 500
                                     Option 101                         Option 501
Option 3 (redirect to google.com)    Option 102 (message:Hello )
                                     Option 103 ======================> Option 700
                                                                        Option 701

私はそれを説明しようと一生懸命に努力しました、私が言おうとしていたことをあなたが理解してくれることを願っています。

ご協力いただきありがとうございます。

4

1 に答える 1

2

ここに迅速で汚い答えがあります...

    <html>
      <head>
        <script type='text/javascript'>
          var drop3Options = {"100":["500","501"],"103":["700","701"]};
          function drop1Change(){
            var value = document.getElementById("drop1").value;
            if(value == "msn")
              window.location.href = "http://www.msn.com";
            else if(value == "google"){
              window.location.href = "http://www.google.com";
            }                
          }
          function drop2Change(){
            var value = document.getElementById("drop2").value;
            var drop3List = document.getElementById("drop3");
            if(drop3Options[value]){
              drop3List.options.length = 0;
              for(var i = 0; i < drop3Options[value].length; i++){
                drop3List.options[i] = new Option(drop3Options[value][i],drop3Options[value][i]);
              }
            }
          }
        </script>
      </head>

      <body>
        <form method='GET' action='serverScript.php'>
          <select id='drop1' onchange='drop1Change()'>
            <option value='msn'>MSN</option>
            <option value='dr2'>DROP 2</option>
            <option value='google'>GOOGLE</option>  
          </select>

          <select id='drop2' onchange='drop2Change()'>
            <option value='100'>100</option>
            <option value='101'>101</option>
            <option value='102'>102</option>  
            <option value='103'>103</option>              
          </select>         

          <select id='drop3'>
            <option value='500'>500</option>
            <option value='501'>501</option>
          </select>
          <input type='submit' value='SUBMIT'/>
        </form>
      </body>
    </html>

明らかに、あなたがこのスクリプトを使用して何をしているのか正確にはわからないので、仮定を立ててより良いコードを提供するのは難しいですが、これは私が質問を理解したことを行います..私もわかりませんこれを送信するサーバー側スクリプト。ただし、サーバー スクリプトの場所を反映するように、フォームの ACTION 属性を変更するだけです。

JavaScript には 1 つのグローバル変数 (drop3Options) があります。これは、3 つのオプションを選択するための 2 つの配列を保持する 2 つのプロパティを持つオブジェクトです。

したがって、drop3Options['100'] は配列 ['500','501'] を保持し、drop3Options['103'] は配列 ['700','701'] を保持します。

選択ボックスを変更すると、適切なメソッドが呼び出されます。これは、各選択要素に「onchange」属性を追加することによって行われ、値を見てそれに応じて処理を行う関数を呼び出します。

これ以上のことをする必要があると思いますので、より具体的にコメントしてください。喜んでお手伝いします

于 2012-05-28T20:11:34.583 に答える