当从下拉列表中选择一个值时，jQuery 使输入文本变为只读

Question

我的 html 标记是这样的

<table id="sales-product-details">
  <tbody id="tableToModify">
    <tr>
        <td>
          <select id="prd_dtype1" class="discount-type" name="prddtype[]">
            <option value="">none</option>
            <option value="1">discount type 1</option>
            <option value="2">discount type 2</option>
            <option value="3">discount type 3</option>
          </select>
        </td>
        <td>
          <input type="text" class="dicount-price" onkeyup="calprice2(this.value,'1');" id="prd_damount1" name="prddamount[]">
        </td>
      </tr>
    </tbody>
  </table>

现在我想在 jQuery 中，当我从折扣类型的下拉列表中选择 none 时，折扣价格的输入文本字段将是只读的，当我选择除 none 之外的任何值时，输入文本字段为折扣价将变成输入区(不可只读)。 任何帮助和建议都将非常感激。谢谢..

Answer 1

使用select change()事件获取选中的值，使用prop()改变input的readonly属性

 $('#prd_dtype1').change(function(){
    if(this.value == ""){
        $('#prd_damount1').prop('readonly',true);
     } else{
      $('#prd_damount1').prop('readonly',false);
   }
 }).change(); //<--- calling the change event here to make sure change event  is called as soon as the document is ready ...

或简单的方法(无条件)

 $('#prd_dtype1').change(function(){
    $('#prd_damount1').prop('readonly',!this.value);
 }).change();

如果您需要在未选择任何输入值时输入值为空，那么您可以使用

 $('#prd_damount1').val('');

在第一个答案的 if 条件内。

fiddle here