如何通过乘值下拉列表禁用输入

Question

我需要在下拉列表选择 "custom" 时启用 "Edit" 的输入字段。仅对于自定义，它将启用，对于所有它必须被禁用。下面的代码

$(function() {
    $('#drpevent').on('change', function(){
        $('#ifedit').prop('disabled', this.value === 'custom');
    });
});

table {border: 1px solid grey; }
input[type='number'] {width: 185px;}
input[type='checkbox'] {-ms-transform: scale(1.5) /* IE */
  -moz-transform: scale(1.5); /* FF */
  -webkit-transform: scale(1.5); /* Safari and Chrome */
  -o-transform: scale(1.5); /* Opera */
  padding: 10px;}
input[type="text"],[type="number"] {background-color: #333333;
      border: 1px solid #000000;
      border-radius: 4px;
      width: 295px;
      height: 30px;
      color: #ffffff;
      font-size: 15px;}
input:focus {  
  border: 2px solid #c67728;
   box-shadow: 10px 3px 110px rgba(0,0,0,.25);
}
.left {text-align: left; color: #ffffff; top: 300px;}
.right {text-align: right;
align: left;
color: #ffffff;}
tr * {font-family:  Arial, Helvetica, sans-serif;}
.input {
  font-size: 15px;
  border: 1px solid #000000;
  border-radius: 4px;
  background: -webkit-linear-gradient(#4a4a4a, #2f2f2f);
  background: -o-linear-gradient(#4a4a4a, #2f2f2f);
  background: -moz-linear-gradient(#4a4a4a, #2f2f2f); 
  background: linear-gradient(#4a4a4a, #2f2f2f);
  width: 295px;
  height: 30px;
  color: #ffffff;
  cursor: pointer;
  }
.input:hover {
  background: -webkit-linear-gradient(#6a6a6a, #444444);
  background: -o-linear-gradient(#6a6a6a, #444444);
  background: -moz-linear-gradient(#6a6a6a, #444444); 
     background: linear-gradient(#6a6a6a, #444444);}
.input:focus {background: -webkit-linear-gradient(#444444, #6a6a6a);
  background: -o-linear-gradient(#444444, #6a6a6a);
  background: -moz-linear-gradient(#444444, #6a6a6a); 
     background: linear-gradient(#444444, #6a6a6a);}
.input * { background:#333333;}
.disabled {opacity: 0.5;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table bgcolor="#000" border="0">
  <tr><td colspan="2" class="left">Example</td></tr>
  <tr><td class="right">If:</td><td>
   <select id="drpevent" name="if" class="input right drp ">
          <option value="click" id="click">click</option>
          <option value="dblclick" id="dblclick">dblclick</option>
          <option value="focus">focus</option>
          <option value="mouseover">mouseover</option>
          <option value="animationstart">animationstart</option>
          <option value="animationend">animationend</option>
          <option value="transitionend">transitionend</option>
          <option value="mousedown">mousedown</option>
          <option value="mouseenter">mouseenter</option>
          <option value="mouseleave">mouseleave</option>
          <option value="mousemove">mousemove</option>
          <option value="mouseout">mouseout</option>
          <option value="mouseup">mouseup</option>
          <option value="orientationchange">orientationchange</option>
          <option value="resize">resize</option>
          <option value="scroll">scroll</option>
          <option value="copy">copy</option>
          <option value="touchend">touchend</option>
          <option value="touchenter">touchenter</option>
          <option value="touchleave">touchleave</option>
          <option value="touchmove">touchmove</option>
          <option value="touchstart">touchstart</option>
          <option value="DomContentLoaded">Сразу при загрузке всех элементов</option>
           <option value="load">В начале загрузке страницы</option>
           <option class="cust" id="custom" value="custom">custom</option>
    </select>
  </td></tr>
  <tr><td class="right">Edit:</td><td><input class="right disabled" id="ifedit" type="text" value="123" ></td></tr>
  <tr>
  <td class="right">
  
    </tr>
  </table>

我有这个脚本，但我不知道如何使用乘法值来完成它。请帮助我)

Answer 1

这会起作用

$(function() {
 $('#ifedit').prop('disabled',true);
 $('#drpevent').on('change', function(){
    $('#ifedit').prop('disabled', $(this).val() !== 'custom');
   ($(this).val() == 'custom' ? $('#ifedit').css({'opacity':1}) : $('#ifedit').css({'opacity':0.5}));
 });
});

因为在这种情况下 disabled 属性有两个值 true 和 false 直到值将不同于 "custom" 它会将 disabled 设置为 true :)

如何通过乘值下拉列表禁用输入

How to disabled input by dropdown list of multiplie value

javascript

jquery

input

drop-down-menu