0

我正在尝试根据选择显示/隐藏两个元素 - 一个标签和一个使用 Javascript getElementsByName 的输入。如果我在标签和输入上进行更改但由于某种原因 Name 不起作用,它可以与 getElementByID 一起使用。这是代码:

<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。

谢谢您的帮助。

4

1 回答 1

0
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-25T02:18:44.637 回答