阅读文档后,我试图在 Bootstrap 5 中找到一种方法,以在切换开关输入设置为“关闭”时禁用其他输入字段?
父元素是#member_form,开关是'toggleswitch'。
当单击表单中的任何内容时,以下内容将禁用该字段。但我想根据切换开关元素从启用切换到禁用并返回?
$(document).on('click', '#member_form', function(){
$("#input_name").attr('disabled','disabled');
});
有什么建议吗?
在 Bootstrap 5 中,您可以使用 Bootstrap Switch 进行切换,并使用 JavaScript 根据切换状态禁用其他输入字段。
$(document).ready(function(){
$('#toggle_switch').bootstrapToggle({
on: 'Enabled',
off: 'Disabled'
});
$('#toggle_switch').change(function(){
if($(this).prop('checked')){
$("#input_name").prop('disabled', false);
// Enable other input fields if needed
} else {
$("#input_name").prop('disabled', true);
// Disable other input fields if needed
}
});
});
<div class="mb-3">
<label for="toggle_switch" class="form-label">Toggle</label>
<input type="checkbox" id="toggle_switch" data-toggle="toggle">
</div>
<div class="mb-3">
<label for="input_name" class="form-label">Name</label>
<input type="text" class="form-control" id="input_name">
</div>