2

警告付きのモーダル ダイアログをポップアップし、警告が確認されるのを待ってから、構築された URL に転送する必要があります。私の現在の試みでは、ダイアログがウィンドウに表示され、すぐに転送されます。

パラメータを最終的な URL に渡すには、各リンク (例ではボタン) が必要ですonclick。html は jsp から生成されます。

デモについては、次を参照してください。

<html>
  <head></head>
  <body>
    <div id='container'>
      <input type='button' name='StackOverflow' value='StackOverflow' onClick="Google('StackOverflow')" />
      <br />
      <br />
      <input type='button' name='CodingHorror' value='CodingHorror' onClick="Google('CodingHorror')" />
      <br />
      <br />
    </div>
    <div id="dialog" style="display: none">
      <em>Going to Google</em>
      <hr />
      <ul>
        <li>No guarantee is made that this will work.</li>
        <li>We take no responsibility for the consequences of this action.</li>
      </ul>
    </div>
    <script type='text/javascript' src='js/jquery.js'></script>
    <script type='text/javascript' src='js/jquery.simplemodal.js'></script>
    <script>
    function Google(s) { 
        // Replace this.
        //alert("Going to: "+s); 
        // What to do here to popup a formatted dialog in place of the alert, wait for it to be acknowledged and then proceed with the forward.
        // Doesn't work.
        jQuery("#dialog").modal(); 
        window.location='http://www.google.co.uk?as_q='+s; 
    }
    </script>
  </body>
</html>

jQueryとsimplemodalが必要です。

4

1 に答える 1

0

ひび割れた!! 経由で転送を行う必要がありonCloseます。

ダイアログ div のクラスを に設定しているsimplemodal-closeので、その中のどこをクリックしても閉じると見なされることに注意してください。これは、これがタッチスクリーン駆動のツールであるためです。

<html>
  <head>
  <style>
    #simplemodal-container {
        background-color:#afafaf; 
        border:solid; 
        padding:12px; 
        cursor:pointer
    }
  </style>
  </head>
  <body>
    <div id='container'>
      <br />
      <br />
      <input type='button' name='StackOverflow' value='StackOverflow' onClick="Google('StackOverflow')" />
      <br />
      <br />
      <input type='button' name='CodingHorror' value='CodingHorror' onClick="Google('CodingHorror')" />
      <br />
      <br />
    </div>
    <div id="dialog" class="simplemodal-close" style="display: none">
      <em>Going to Google</em>
      <hr />
      <ul>
        <li>No guarantee is made that this will work.</li>
        <li>We take no responsibility for the consequences of this action.</li>
      </ul>
    </div>
    <script type='text/javascript' src='js/jquery.js'></script>
    <script type='text/javascript' src='js/jquery.simplemodal.js'></script>
    <script>
    function Google(s) { 
        $.modal($('#dialog'),{
            onClose: function (dialog) {
                window.location='http://www.google.co.uk?as_q='+s;
            }}
        );
    }
    </script>
  </body>
</html>
于 2012-09-03T11:22:00.167 に答える