表单下拉选择链接

Form Dropdown Select Link

本文关键字:链接 选择 表单      更新时间:2024-05-13

我有一个选择下拉列表,一旦用户指定了我希望它在2个URL的新选项卡中链接的品牌。我该怎么做呢?最好是为提交做onclick事件,然后通过选择运行一个带有"if and else"的函数。。有什么建议吗?这是我当前的代码。

     <fieldset>
      <legend><span class="number">1</span>Select a Brand</legend>
      <label for="Brand">Brand:</label>
      <select id="brandSelect" name="brand_select">
        <optgroup label="Grills">
          <option value="http://site1.com", "http://site1A.com">DCS</option>
          <option value="http://site2.com", "http://site2A.com">Alfresco</option>
          <option value="http://site3.com", "http://site3A.com">Viking</option>
          <option value="http://site4.com", "http://site4A.com">Fire Magic</option>
          <option value="http://site5.com", "http://site5A.com">Lynx</option>
          <option value="http://site6.com", "http://site6A.com">Coyote</option>
        </optgroup>
      </select>
    </fieldset>
    <button type="submit">Sign Up</button>
    <script type="text/javascript">
       var urlmenu = document.getElementById( 'brandSelect' );
       urlmenu.onchange = function() {
            window.open( this.options[ this.selectedIndex ].value );
       };
    </script>

假设您有两个URL作为选项值,例如:

<label for="Brand">Brand:</label>
<select id="brandSelect" name="brand_select">
    <optgroup label="Grills">
        <option value="http://site1.com http://site1A.com">DCS</option>
        <option value="http://site2.com http://site2A.com">Alfresco</option>
        <option value="http://site3.com http://site3A.com">Viking</option>
    </optgroup>
</select>

您可以通过拆分value来提取这两个URL,然后为每个URL打开一个窗口/选项卡。类似的东西

<script type="text/javascript">
   var urlmenu = document.getElementById( 'brandSelect' );
   urlmenu.onchange = function() {
        var urls = this.options[ this.selectedIndex ].value.split(' ');
        urls.forEach( function(url) {
            window.open( url /*, '_blank'*/); // add a window name if desired
        });
   };
</script>

使用窗口所需的任何参数。打开(…)

 window.open( this.options[ this.selectedIndex ].value, "window_"+Math.round(Math.random()*9999) );

给每个窗口一个唯一的名称就可以了。http://jsfiddle.net/qx2ppssn/

尝试定义窗口名称:

该代码用于生成从0到10000的随机数字

Math.round(Math.random()*10000)

串联随机化数字和单词"window"作为名称,如"window777",uniq用于每次调用事件处理程序函数。

"window"+Math.round(Math.random()*10000)

由于每个调用的名称都是uniq,方法window.open将创建新窗口(在当前情况下为选项卡)

窗口中的加载项。打开调用

window.open( this.options[ this.selectedIndex ].value, "window"+Math.round(Math.random()*10000));

这都是