jquery禁用每个按钮 - jquery disable each button

jquery disable each button

本文关键字：按钮 jquery | 更新日期: 2023-09-27

>我有一个带有文本区域和按钮的表格我希望按钮在文本区域为空时禁用，并在不为空或用户填充该文本区域时启用

这是我的示例 HTML 代码我使用 PHP 循环生成此表

<table>
<tr>
<td><textarea name="text1" id="text1"></textarea></td>
<td><input type="button" class="btn btn-primary" id="btn1"></td>
</tr>
<tr>
<td><textarea name="text2" id="text2"></textarea></td>
<td><input type="button" class="btn btn-primary" id="btn2"></td>
</tr>
<tr>
<td><textarea name="text3" id="text3"></textarea></td>
<td><input type="button" class="btn btn-primary" id="btn3"></td>
</tr>
</table>

对于禁用按钮，我想使用addclass"禁用"和romoveclass"enabeled"对于 enabeling，请使用 addclass "enabeled" 和 removeclass "disabled"

请帮助我使用jquery。谢谢之前

你可以做这样的事情：

$('textarea').on('keyup keydown keypress change paste', function() {
    if ($(this).val() === '') {
      $(this).closest('tr').find('.btn').removeClass('enabled').addClass('disabled')
    } else {
      $(this).closest('tr').find('.btn').removeClass('disabled').addClass('enabled')
    }
  });

.disabled {
  color: red;
  }
.enabled {
  color: green;
  }

You can do something like this:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
<td><textarea name="text1" id="text1"></textarea></td>
<td><input type="button" class="btn btn-primary disabled" id="btn1" value="Submit"></td>
</tr>
<tr>
<td><textarea name="text2" id="text2"></textarea></td>
<td><input type="button" class="btn btn-primary disabled" id="btn2" value="Submit"></td>
</tr>
<tr>
<td><textarea name="text3" id="text3"></textarea></td>
<td><input type="button" class="btn btn-primary disabled" id="btn3" value="Submit"></td>
</tr>
</table>