如何使用html选择器选项禁用和启用输入元素

时间:2019-06-07 08:26:44

标签: javascript css

如果我选择值name="sellprice"选项,我想使输入元素sell启用,否则输入元素将被禁用。

<select id="selling" name="selling">
  <option value="">-- Choose --</option>
  <option value="free">Open Source</option>
  <option value="sell">I Wan't To Sell</option>
</select>

<div class="kd-title-show md-radio-inline">
  <label for="4">Price :</label>
  <input id="4" type="textbox" class="form-title" name="sellprice" placeholder="Min-$5 to Max-$100 " disabled>
</div>

这是我的Javascript代码,我已经在下面的代码中尝试过,但是无法正常工作。

$(document).ready(function(){
  $("select[name='selling']").on('change',function(){
    if($(this).val()== "free"){
      $("input[name='sellprice']").prop("disabled",false);
    }else{
      $("input[name='sellprice']").prop("disabled",true);
    }
  });
});

3 个答案:

答案 0 :(得分:0)

  

我要启用输入元素名称=“ sellprice”   -这不是输入,而是下拉列表

     

如果我选择价值出售选项,则其他输入元素将被禁用。 -根据您目前的解释,我知道如果选择了第三个选项,您想禁用该下拉列表

如果选择了第三个选项,则将禁用下拉菜单。

sum(grepl("[[:digit:]]+[NA]+[[:digit:]]", do.call(paste0, df)))
$(document).ready(function() {
    $('#mounth').change(function() { 
  	if( $(this).val() == "sell") {
            $('#mounth').prop( "disabled", true );
        }
  });
});

如果在选择第三个选项的情况下想要禁用输入,则以下代码将完成

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.1/jquery.min.js"></script>
<select id="mounth" name="selling">
  <option value="">-- Choose --</option>
  <option value="free">Open Source</option>
  <option value="sell">I Don't Want To Sell</option> 
</select>

<div class="kd-title-show md-radio-inline">
  <label>Price :</label>
  <input id="textInput" type="textbox" class="form-title" name="sellprice" placeholder="Min-$5 to Max-$100 " disabled>
</div>
$(document).ready(function() {
 	$('#mounth').change(function() { 
  	if( $(this).val() == "sell") {
       		$('#textInput').prop( "disabled", true );
    } else {       
      $('#textInput').prop( "disabled", false );
    }
  });
});

答案 1 :(得分:0)

请看一看,希望对您有用。

$(document).ready(function(){
  $("select[name='selling']").on('change',function(){
    if($(this).val()== "sell"){
      $("input[name='sellprice']").prop("disabled",false);
    }else{
      $("input[name='sellprice']").prop("disabled",true);
    }
  });
});

答案 2 :(得分:-1)

<select id="mounth" onchange="myOnChangeFunction()" name="selling">
             <option value="">-- Choose --</option>
             <option value="free">Open Source</option>
             <option value="sell">I Wan't To Sell</option> 
         </select>

<div class="kd-title-show md-radio-inline">
  <label for="4">Price :</label>
  <input id="4" type="textbox" class="form-title" name="sellprice" placeholder="Min-$5 to Max-$100 " disabled>
</div>

在js

<script>
function myOnChangeFunction() {
  var val = document.getElementById("mounth").value;

if(val === "sell"){
document.getElementById('4').disabled = false;
}else{
document.getElementById('4').disabled = true;
}

}
</script>