Question

我在HTML表单中有多个具有相同ID的字段，如果特定字段的值为1，我想隐藏它们但是它只隐藏该id的第一个字段，所有其他字段都不隐藏

<div class="form-group">
    <label class="col-md-3 control-label" for="example-text-input" id="g">Days of week</label>
    <div class="col-md-9">
        <div class="checkbok">
            <label for="example-checkbox1">
            <input type="checkbox" id="g" name="gender" value="monday">Monday
            </label>
        </div>
        <div class="checkbok">
            <label for="example-checkbox1">
            <input type="checkbox" id="g" name="gender" value="tuesday">Tuesday
            </label>
        </div>
        <div class="checkbok">
            <label for="example-checkbox1">
            <input type="checkbox" id="g" name="gender" value="wednesday">Wednesday
            </label>
        </div>
        <div class="checkbok">
            <label for="example-checkbox1">
            <input type="checkbox" id="g" name="gender" value="thursday">Thursday
            </label>
        </div>
        <div class="checkbok">
            <label for="example-checkbox1">
            <input type="checkbox" id="g" name="gender" value="friday">Friday
            </label>
        </div>
        <div class="checkbok">
            <label for="example-checkbox1">
            <input type="checkbox" id="g" name="gender" value="saturday">Saturday
            </label>
        </div>
        <div class="checkbok">
            <label for="example-checkbox1">
            <input type="checkbox" id="g" name="gender" value="sunday"> Sunday
            </label>
        </div>
    </div>
</div>  
<div class="form-group">
    <label class="col-md-3 control-label" for="example-text-input" id="g">Time</label>
    <div class="col-md-3">
        <select id="g" name="nod" class="form-control">
        <?php 
            for($i=1;$i<=12;$i++){
                echo"<option value='$i'>$i AM</option>"; 
            } 
            for($i=1;$i<=12;$i++){
                echo "<option value='12+$i'>$i PM</option>";
            }?>                         
        </select>
    </div>
</div>

所有元素都具有相同的id =＆＃34; g＆＃34; .Below是javascript代码

<script type="text/javascript">
    var ele=document.getElementById("st").value;
    if(ele==1)
        document.getElementById("g").style.visibility = "hidden";
    //else
        //document.getElementById("g").style.visibility = "none";
</script>

但是只有第一个元素（即一周的文本日期）被隐藏所有其他元素都被显示出来。我如何隐藏所有其他元素

Answer 1

ID在html字段中应该是唯一的，但您可以使用相同的名称属性/类名。你必须遍历使用classname或name属性提取的元素数组。

在您的案例中使用名称属性

 function hideGender(){
     var ele=document.getElementById("st").value;
   if(ele==1){
    var elements=document.getElementsByName("gender");
    for(var i=0;i<elements.length;i++)
     elements[i].style.visibility = "hidden";
   }
 }

Answer 2

ID在文档中应该是唯一的。将id="g"更改为class="g"。

 <label for="example-checkbox1">
      <input type="checkbox" class="g" name="gender" value="saturday"> Saturday
 </label>


    <script type="text/javascript">
   Array.filter( 
   document.getElementsByClassName('g'),
   function(elem){
   elem.style.visibility = 'hidden';
   });
    </script>

Answer 3

要选择具有相同ID的多个字段，您必须使用 -

var visitor = new MemberAccessVisitor(typeof(TSource));

visitor.Visit(memberMap);

var propertyNames = visitor.PropertyNames;

所以在你的情况下 -

$('[id="yourFieldId"]');

以html格式隐藏多个字段

3 个答案: