2

我的代码没有禁用其他字段。请帮助我尝试选择参与者或参展商。一旦选择参与者，其他字段必须禁用。

html

 <label> <span>Test:</span>
    <select  id="reg" name="reg" onkeyup="disableField()">
      <option value="" selected="selected" >Select Your Registration type  </option> 
      <option value="Male">Participant</option>
     <option value="Female">Exhibitor</option>
    </select>                                   
 </label>


<label> <span>test 1 field:</span>
   <input type="text"  name="test1" id="test1"/>
   </label>
   <label> <span>test field 2:</span>
   <input type="text"  name="test2" id="test2"/>
</label>

javascript

   var disableField = function () {
   var state = document.getElementById("reg").value === "Participant";
    document.getElementById("test1").disabled = state;
    document.getElementById("test2").disabled = state;
    };
4

5 回答 5

1

不要使用内联 javascript。它使您的代码混乱且不可重用。

[编辑]这是一个适合您的工作示例：

<html>
   <head> <title></title></head>
   <body>
     <label> <span>Test:</span>
        <select  id="reg" name="reg">
          <option value="" selected="selected" >Select Your Registration type  </option> 
          <option value="Male">Participant</option>
         <option value="Female">Exhibitor</option>
        </select>                                   
     </label>

    <label> <span>test 1 field:</span>
       <input type="text"  name="test1" id="test1"/>
       </label>
       <label> <span>test field 2:</span>
       <input type="text"  name="test2" id="test2"/>
    </label>
   <script type="text/javascript">
//<!--
   var obj = document.getElementById("reg");
   obj.onchange = function(event){
     if(this.value=="Male"){
        document.getElementById("test1").disabled = 'disabled';
        document.getElementById("test2").disabled = 'disabled';
     }else{
        document.getElementById("test1").disabled = '';
        document.getElementById("test2").disabled = '';
     }
   }
   //--></script>
   </body>
</html>

[/编辑]

玩得开心，愿源与你同在。

于 2013-10-09T08:41:20.817 回答
0

首先，使用 onchange：

<select  id="reg" name="reg" onchange="disableField()">

第二：

您的选项值为“男性”和“女性”。所以用它来比较：

var state = document.getElementById("reg").value == "Male";
于 2013-10-09T08:34:50.673 回答
0

在选择列表中添加更改

<select  id="reg" name="reg" onchange="SelectedIndexChanged(this)">

function SelectedIndexChanged(e){
    var selectedValue= e.value;
    //if Participant is selected
     if(selectedValue == "Participant "){
      document.getElementById("test1").disabled = true; 
      document.getElementById("test2").disabled = true; 
     }
    }
于 2013-10-09T08:42:56.983 回答
0

试试这个....它正在工作

<script type="text/javascript">

    function disableField() {
        var state = document.getElementById("reg").value === "Participant";
        if (state == false) {
            document.getElementById("test1").style.visibility = "hidden";
            document.getElementById("test2").style.visibility = "hidden";
        }
    };
</script>
于 2013-10-09T08:48:44.887 回答
0

尝试这个，

<label> <span>Test:</span>
    <select  id="reg" name="reg" onchange="disableField();">
      <option value="" selected="selected" >Select Your Registration type  </option> 
      <option value="Male">Participant</option>
     <option value="Female">Exhibitor</option>
    </select>                                   
 </label>


<label> <span>test 1 field:</span>
   <input type="text"  name="test1" id="test1"/>
   </label>
   <label> <span>test field 2:</span>
   <input type="text"  name="test2" id="test2"/>
</label>

JS

function disableField() {
    var val = document.getElementById("reg").value;
    if(val == 'Male') {
        document.getElementById("test1").disabled = true; 
        document.getElementById("test2").disabled = true; 
    } else {
        document.getElementById("test1").disabled = false; 
        document.getElementById("test2").disabled = false; 
    }
}

检查值Male是否Participant

这是工作代码，

<html>
    <head>
        <script>
            function disableField() {
                alert('jdhsfg')
                var val = document.getElementById("reg").value;
                if(val == 'Male') {
                    document.getElementById("test1").disabled = true; 
                    document.getElementById("test2").disabled = true; 
                } else {
                    document.getElementById("test1").disabled = false; 
                    document.getElementById("test2").disabled = false; 
                }
            }
        </script>
    </head>

    <body>
        <label> <span>Test:</span>
            <select  id="reg" name="reg" onchange="disableField();">
                <option value="" selected="selected" >Select Your Registration type  </option> 
                <option value="Male">Participant</option>
                <option value="Female">Exhibitor</option>
            </select>                                   
        </label>


        <label> <span>test 1 field:</span>
            <input type="text"  name="test1" id="test1"/>
        </label>
        <label> <span>test field 2:</span>
            <input type="text"  name="test2" id="test2"/>
        </label>

    </body>
</html>
于 2013-10-09T08:55:58.353 回答