HTML：target =“ _ blank”用於下拉列表

Question

問題：使用select -option打開一個新窗口

<form onsubmit="return handleSubmit()" target="_blank" method="get" name="moduleForm" id="moduleForm">
<font size=2 face = verdana color= #0000ff ><b>Search</b></font>

    <select name="allSelect" id="allSelect">
    <optgroup label="Historical">
    <option value="http://www.something.com/cse?cx=0000000000000&sa=Search&q=">Open in a new window 1</option>
    <option value="http://www.google.com/cse?cx=0000000000000000A-cmjrngmyku&ie=UTF-8&sa=Search&q=">Open in a new window 2</option>
    </optgroup>
    </select>

<input type="text" name="allQuery" id="allQuery" size="22" />
<input type="submit" value=" Go " />

問題：如何使用選擇框將內容打開到新窗口？

Answer 1

您可以通過window.open（）打開鏈接：

<select name="allSelect" id="allSelect">
<optgroup label="Historical">
<option value="http://www.something.com/cse?cx=0000000000000&sa=Search&q=">Open in a new window 1</option>
<option value="http://www.google.com/cse?cx=0000000000000000A-cmjrngmyku&ie=UTF-8&sa=Search&q=">Open in a new window 2</option>
</optgroup>
</select>

<input type="button" 
    value="open in a new window" 
    onclick="window.open(document.getElementById(allSelect).value);" />

Answer 2

看一看window.open函數。

Answer 3

請記住，您的頁面無需腳本就可以使用，因此，我建議實現一種后備機制：表單應調用服務器端腳本，該腳本以30x狀態和Location標頭響應。

客戶端看起來像這樣：

<form action="path-to-redirection-script" method="GET" target="_blank"
 onsubmit="window.open(this.elements['foo'].value); return false;">
 <select name="foo" size="1">
  <option value="http://google.com">google</option>
 </select>
 <input type="submit" value="go">
</form>

另外，請記住target="_blank" / window.open() 通常是邪惡的 。

Answer 4

修改您的handleSubmit函數 ，如下所示：

function handleSubmit()
{
    var form = _gel("moduleForm"),
        elm = _gel("allQuery"),
        selectElm = _gel("allSelect");
    if (elm != "" && selectElm != "") {
        var query = elm.value;
        var searchUrl = selectElm.value;
        if (query != "" && searchUrl != "") {
            searchUrl += escape(query);
            window.open(searchUrl, form.target || "_blank");
        }
    }
    return false;
}