Question

带有一些textareas和一个sumbit按钮的表单都被禁用，每个textarea都有一个复选框。

选中复选框时：

1-一条消息显示（你不应该让激活的textarea为空）

2-提交按钮保持禁用状态

3-开始编写消息隐藏和启用按钮时。

取消选中复选框时：

1-消息隐藏

如果它有一些文本

，则清除与之相关的2- textarea

3按钮返回禁用

到目前为止，一切都很完美，我的代码如下。现在，如果已经使用空文本区检查了一个复选框，我怎么能阻止检查其他复选框？逻辑是如果启用了textarea，它必须接收文本。

//handling checkbox
$('input:checkbox').change(function() {
  if ($(this).prop('checked')) {
    $(".textareaalert").text("Don't let this activated textarea empty");
    $(".textareaalert").slideDown("slow");
    $("#submit").prop("disabled", true);
  } else {
    $(".textareaalert").slideUp("slow");
    $("#submit").prop("disabled", true);
    $("textarea").val('');

  }
});
//handling textarea
$("textarea").keyup(function() {
  var textareaLength = $(this).val().length;
  if (textareaLength == 0) {
    $(".textareaalert").text("Don't let this activated textarea empty");
    $(".textareaalert").slideDown("slow");
    $("#submit").prop("disabled", true);
  } else {
    $(".textareaalert").slideUp("slow");
    $("#submit").prop("disabled", false);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="textareaalert" style="display:none"></div>
<form class="horizontal">
  <div class="form-group">
    <label>Infancia</label>
    <div class="col-md-9">
      <textarea class="form-control" id="infancia" disabled></textarea>
    </div>
    <div class="col-md-2">
      <input type="checkbox"> <label>Activo</label>
    </div>
  </div>
  // more text area below
</form>

如果textarea为空，则防止检查其他checbox

0 个答案: