最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - HTML: target="_blank" for a drop-down list - Stack Overflow

programmeradmin6浏览0评论

Problem: to open a new window with the 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=";sa=Search&q=">Open in a new window 1</option>
    <option value=";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 " />

Question: How can I open the content to a new window with a select-box?

Problem: to open a new window with the 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./cse?cx=0000000000000&sa=Search&q=">Open in a new window 1</option>
    <option value="http://www.google./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 " />

Question: How can I open the content to a new window with a select-box?

Share Improve this question edited Jul 12, 2009 at 14:39 Canavar 48.1k17 gold badges94 silver badges126 bronze badges asked Jul 12, 2009 at 14:29 Léo Léopold Hertz 준영Léo Léopold Hertz 준영 142k189 gold badges465 silver badges713 bronze badges 5
  • 2 What does handleSubmit() do? – Gumbo Commented Jul 12, 2009 at 14:38
  • Gumbo: Please, see an example here: savedbythegoog.appspot./…. – Léo Léopold Hertz 준영 Commented Jul 12, 2009 at 14:54
  • 2 _gel(id) : A wrapper around the JavaScript document.getElementById() function from google gadgets. moduleForm is only the name of the <form> element. To find the right <form>, getElementById is udes. – Martin K. Commented Jul 12, 2009 at 21:35
  • @Martin K.: Very interesting thing there. Do you mean "Unix Desktop Environments" in the sentence "To find the right <form>, getElementById is udes. "? I cannot see the relation to the topic, wondering... – Léo Léopold Hertz 준영 Commented Jul 12, 2009 at 21:52
  • @SimpleThings: That was my reply to the other question you opened (has been delted) – Martin K. Commented Jul 13, 2009 at 14:12
Add a ment  | 

4 Answers 4

Reset to default 1

Modify your handleSubmit function as follows:

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;
}

You can open your links by window.open() :

<select name="allSelect" id="allSelect">
<optgroup label="Historical">
<option value="http://www.something./cse?cx=0000000000000&sa=Search&q=">Open in a new window 1</option>
<option value="http://www.google./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);" />

Give a look to the window.open function.

Keep in mind that your page should be usable without scripting, so I'd suggest implementing a fallback mechanism: The form should call a server-side script which responds with a 30x status and a Location header.

The client-side would look like this:

<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.">google</option>
 </select>
 <input type="submit" value="go">
</form>

Also, remember that target="_blank" / window.open() is often evil.

发布评论

评论列表(0)

  1. 暂无评论