Javascript搜索表單代碼

Question

我有一個搜索表單，我想用我的網站在一個框中輸入文本，並使用單選按鈕選擇搜索引擎（網站搜索或我的圖書館目錄）。

此代碼在Firefox和Chrome，但不是IE瀏覽器和Safari瀏覽器的工作原理：

<script type="text/javascript"> 
function dosearch() { 
var sf=document.searchform; 
var submitto = sf.sengines.value + escape(sf.searchterms.value); 
window.location.href = submitto; 
return false; 
} 
</script> 

<form name="searchform" onSubmit="return dosearch();"> 
<input type="text" name="searchterms" size="20"> 
<input type="submit" name="SearchSubmit" value="Search"> 
<br /> 
<input type="radio" name="sengines" checked value="http://chelmsford.mvlc.org/search/keyword/">Catalog &nbsp;&nbsp;&nbsp; 
<input type="radio" name="sengines" value="http://chelmsfordlibrary.org/?s=">Site 
</form> 

而且我也有這樣的代碼，這在IE工作，但不能在Firefox：

<script> 
function myFunction() { 
var engine = document.forms[0]; 
var txt = ""; 
var term = escape(document.radiosearch.searchterms.value) 
var i; 
for (i = 0; i < engine.length; i++) { 
    if (engine[i].checked) { 
     txt = txt + engine[i].value; 
    } 
} 
window.location.href = txt + term; 
} 
</script> 

<form name="radiosearch" onSubmit="return myFunction();"> 
<input type="text" name="searchterms" size="20"> 
<input type="submit" value="Search"> 
<br /> 
<input type="radio" name="engine" value="http://chelmsford.mvlc.org/search/keyword/" checked>Catalog</input> &nbsp;&nbsp;&nbsp; 
<input type="radio" name="engine" value="http://chelmsfordlibrary.org/?s=">Site</input> 
</form> 

我怎樣才能合併或更正這些，所以一段代碼可以在所有瀏覽器中工作？

Answer 1

您正在使用獲取單選按鈕值的非標準方法。我建議這裏面在Chrome，IE和Firefox的工作（我沒有嘗試Safari瀏覽器的能力，但它應該也在那裏工作）：

function dosearch() { 
    var sf = document.searchform; 
    var searchLocation = sf.querySelector('input[name="sengines"]:checked').value; 
    window.location.href = searchLocation + encodeURIComponent(sf.searchterms.value); 
    return false; 
} 

而且，這裏是用來記錄URL工作演示它會去：https://jsfiddle.net/jfriend00/h873sfgw/

---

僅供參考，一個老式的方式來獲得的單選按鈕組的值，包括手動通過每個單選按鈕迭代，直到找到一個是.checked。 http://www.dyn-web.com/tutorials/forms/radio/get-selected.php

---

下面是上述「老土」的方式來解決這個問題，在舊版本的IE的作品之一代碼：

function log(x) { 
 
    var div = document.createElement("div"); 
 
    div.innerHTML = x; 
 
    document.body.appendChild(div); 
 
} 
 

 
function dosearch() { 
 
    var form = document.getElementById("searchform"); 
 
    var terms = document.getElementById("searchterms") 
 
    var searchLocation = getRadioValue(form, "sengines"); 
 
    //window.location.href = searchLocation + encodeURIComponent(terms.value); 
 
    log(searchLocation + encodeURIComponent(terms.value)); 
 
    return false; 
 
} 
 

 
function getRadioValue(formObj, groupName) { 
 
    var inputs = formObj.getElementsByTagName("input"), item; 
 
    for (var i = 0; i < inputs.length; i++) { 
 
     item = inputs[i]; 
 
     if (item.type === "radio" && item.name === groupName && item.checked) { 
 
      return item.value; 
 
     } 
 
    } 
 
}

<form id="searchform" name="searchform" onsubmit="return dosearch();"> 
 
<input type="text" id="searchterms" name="searchterms" size="20"> 
 
<input type="submit" name="SearchSubmit" value="Search""> 
 
<br /> 
 
<input type="radio" name="sengines" checked value="http://chelmsford.mvlc.org/search/keyword/">Catalog &nbsp;&nbsp;&nbsp; 
 
<input type="radio" name="sengines" value="http://chelmsfordlibrary.org/?s=">Site 
 
</form>

您可以按照這裏介紹做與功能