启用和使用jquery上点击按钮禁用输入字段（laravel5.3）

问题描述：

我有一个按钮，它看起来像一个在OFF按钮 启用和使用jquery上点击按钮禁用输入字段（laravel5.3）

按钮默认上但是当用户点击它应该得到关闭，并且点击时，应该禁止输入字段我的按钮是

按钮

<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

请帮助其不为我工作

您要禁用输入字段，对吗？ –

是禁用，如果再次点击它也可以启用 –

但我申请Fullname Class到DIV –

答

您的第一个代码缺少一些东西。像类FullName

控制您可以通过使用$('#on_off').is(':checked')或在这种情况下$(this).is(':checked')因为我们使用$('#on_off')点击事件得到复选框的值。

既然你没有一个“全名”级随时随地在你的榜样，我添加email到Id场input

$('#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>

亲爱的，它不为我工作:( –

如果您阅读我的文章，你会注意到，我说你的代码的一些部分是缺少。'$（'。FullName'）'不存在于你的代码的例子。请更新你的问题或者更清楚一下什么不工作 –

亲爱的我添加了我的输入中的全名班请查看我的问题 –

答

请试试这个代码。

这是你更新后的代码：

<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 : '' }}" id= "email"required /> 
</div> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
<script> 
$(document).ready(function() { 
    $('#on_off').change(function() { 
     //alert(); 
     if ($(this).prop('checked')) { 
      $('.FullName input').prop('disabled', false); 
     } 
     else { 
      $('.FullName input').prop('disabled', true); 
     } 
    }); 
}); 

</script>

希望，这可能会帮助你。

答

使用.attr('disabled',true)或.removeAttr('disabled')而不是.prop('disabled', true);如果不工作。

答

这是最容易得到的。

创建一个复选框。在复选框的单击事件中，将其状态作为布尔值传递给按钮禁用的值。

虽然我会建议使用现成的切换按钮。 Link是here

$(document).ready(function(){ 
 
    $(":checkbox").change(function(){ 
 
    $(":button").prop("disabled",$(this).is(":checked")); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type=checkbox /> 
 
<input type=button value=Target />

启用和使用jquery上点击按钮禁用输入字段（laravel5.3）

相关推荐