根據選擇顯示/隱藏表單元素

我試圖根據選擇顯示/隱藏兩個元素 - 使用Javascript getElementsByName的標籤和輸入。它與getElementByID一起工作，如果我在標籤和輸入上進行更改，但由於某種原因，Name不起作用。下面是代碼：根據選擇顯示/隱藏表單元素

<script language="JavaScript" type="text/javascript"> 
<!-- 

function Toggle(obj){ 
var val=obj.value; 
if (!obj.m){ obj.m=''; } 
if (!obj.m.match(val)){ obj.m+=','+val+','; } 
var hide=obj.m.split(','); 
for (var zxc0=0;zxc0<hide.length;zxc0++){ 
    if (document.getElementsByName(hide[zxc0])){ 
    document.getElementsByName(hide[zxc0]).style.display='none'; 
    } 
} 
var show=val.split(','); 
for (var zxc1=0;zxc1<show.length;zxc1++){ 
    if (document.getElementsByName(show[zxc1])){ 
    document.getElementsByName(show[zxc1]).style.display=''; 
    } 
} 
} 

//--> 
</script>

，這裏是爲表單元素：

  <div id="styled-select"> 
      <select name="how" onchange="Toggle(this);" class="dropdown"> 
        <option value="Internet Search">Internet Search</option> 
        <option value="Facebook" >Facebook</option> 
        <option value="Twitter" >Twitter</option> 
        <option value="LinkedIN" >LinkedIN</option> 
        <option value="Referral">Referral</option> 
        <option value="Other">Other</option> 
      </select> 
      </div>     
      <label name="Referral" style="display:none;">Referred By:</label> 
      <input name="Referral" style="display:none;" value="" class="hidden-txt">

當用戶選擇「轉診」它應該顯示的標籤和輸入命名爲「推薦」。如果我使用getElementByID，我有這個工作，給了選項兩個值用逗號分隔，並使用單獨的ID作爲標籤和輸入。

謝謝你的幫助。

來源

2012-10-25 Peter Susko

'getElementsByName'返回的數組不是一個元素。 –

除了「ID」之外還有別的建議，因爲我需要顯示兩個表單元素？ –

var elems = document.getElementsByName(hide[zxc0]); 
if(elems) { 
    for(var i = 0;i < elems.length;i++) { 
     elems[i].style.display='none'; 
     //Do whatever else you need to do with the element. 
    } 
}

正如Kevin Boucher所述，getElementsByName返回一個數組。假設你想將display = none樣式應用於所有具有該名稱的元素，上面的代碼將實現這一點。同樣出於性能考慮，上面的代碼只調用document.getElementsByName（）一次，而不是3+次以上，我相信這會有好處。

它可能是值得調查JQuery易於選擇元素。

來源

2012-10-25 02:18:44 mricci

根據選擇顯示/隱藏表單元素

回答

相關問題