javascript - 使用 jquery 启用和禁用单击按钮上的输入字段(laravel5.3)

Question

我有一个看起来像开关按钮的按钮

按钮默认打开，但当用户单击它时，它应该关闭，并且当单击它时，它应该禁用输入字段 我的按钮是

按钮

<input type="checkbox" class="make-switch" id="on_off" name="double_optin" checked data-on-text="on" data-off-text="off">

输入字段，如果点击上面的按钮，我希望禁用该字段

<div class="col-md-4 FullName">
 <input type="text" class="form-control" name="email" value="{{ isset($student->email) ? $student->email : '' }}" required />
 </div>

我的Jquery代码如下

$('#on_off').click(function(){
    $('.FullName').prop('disabled', true);
});

我从 Disable Input field 获取了上述帮助

请帮忙，它不适合我

Answer 1

你的第一个代码缺少一些东西。就像带有 FullName

类的控件一样

您可以使用 $('#on_off').is(':checked') 获取复选框的值，在本例中为 $(this).is(' :checked') 因为我们使用的是 $('#on_off') 点击事件。

由于您的示例中的任何位置都没有“Fullname”类，因此我将 email 添加到 input 的 Id 字段

$('#on_off').click(function() {

  $('.FullName [name="email"]').attr('disabled', $(this).is(':checked') ? false : true);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" class="make-switch" checked id="on_off" name="double_optin" data-on-text="on" data-off-text="off">

<div class="col-md-4 FullName">
  <input type="text" class="form-control" name="email" value="disable me by click on checkbox" required />
</div>