javascript - 在表单中使用 jQuery 更改输入文本值
问题描述
我有 2 个复选框输入和 1 个输入文本。 当我单击复选框 #1 时,我想禁用复选框 #2,然后在输入文本中添加一个文本 (my-text-1) 并使其不可更改
当我单击复选框 #2 时,我想禁用复选框 #1,然后在输入文本中添加一个文本 (my-text-2) 并使其不可更改
使用 jQuery 3.4.1
所以,它有效,但......
当我提交表单时,输入文本的值没有记录在我的数据库中。这就像字段是空的。
$(document).ready(function(){
$("#checkbox1").on('click', function(){
if($(this).is(':checked')) {
$("#inputtext").val("my-text-1").prop('disabled', true);
$("#checkbox2").prop('disabled', true);
} else {
$("#inputtext").val("").prop('disabled', false);
$("#checkbox2").prop('disabled', false);
}
});
$("#checkbox2").on('click', function(){
if($(this).is(':checked')) {
$("#inputtext").val("my-text-2").prop('disabled', true);
$("#checkbox1").prop('disabled', true);
} else {
$("#inputtext").val("").prop('disabled', false);
$("#checkbox1").prop('disabled', false);
}
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label>Checkbox #1</label>
<input id="checkbox1" type="checkbox" value="" name="checkbox1"><br/>
<label>Checkbox #2</label><input id="checkbox2" type="checkbox" value="" name="checkbox2"><br/>
<label>Text : </label><input name="inputtext" id="inputtext" type="text" size="50" maxlength="50" value="" />
解决方案
而不是disabled
在input[text]
元素上使用属性使用readonly
属性。disabled
未提交元素的数据:
$("#inputtext").val("my-text-1").prop('readonly', true);
另一种选择是在提交表单之前启用该元素。
推荐阅读
- elixir - Elixir 无法在定义它的同一文件中创建结构
- javascript - Chart.js 工具提示不显示
- python - Python,OpenCV 无法关闭最后一个窗口
- c# - 如何在 Winforms C# 中删除选定的控件?
- linux - 在c中识别虚拟网络接口
- android - 生成签名的 APK 时出错
- digital-signature - 如何在 javacard 小程序上签名并将签名返回给主机应用程序
- jquery - jQuery.validate() 错误:未捕获的 TypeError:无法读取未定义的属性“设置”
- amazon-web-services - 使用 Mandrill 邮件服务的队列 (SQS)
- php - 回声重复变量循环php