我是 jQuery 新手。任何帮助将不胜感激
我有两个单选按钮和两个文本框，我在其中使用 jquery 显示日期。
当我点击 Radio1 然后在两个文本框中我应该能够选择日期但是当我点击 Radio2 然后我不应该能够在 text2 字段中选择日期。 text2 字段应该被禁用并且 jquery 日期选择器不应该工作。
我已经禁用了 text2 字段，但日期功能仍然有效。
--
我的代码在这里
<script language='javascript'>
<!-- //
function setReadOnly(obj)
{
if(obj.value == "yes")
{
document.forms[0].text2.style.backgroundColor = "#ffffff";
document.forms[0].text2.readOnly = 0;
document.forms[0].text2.value = "";
} else {
document.forms[0].text2.style.backgroundColor = "#eeeeee";
document.forms[0].text2.readOnly = 1;
document.forms[0].text2.value = "Not applicable!";
document.forms[0].number = disbaled;
}
}
// -->
</script>
<script>
$(document).ready(function() {
$("#text1").datepicker
({
showOn: 'button', buttonImage: 'images/cal.gif', buttonImageOnly: true,
dateFormat: 'dd-mm-yy',
numberOfMonths: 2,
minDate:0
})
$("#text2").datepicker
({
showOn: 'button', buttonImage: 'images/cal.gif', buttonImageOnly: true,
dateFormat: 'dd-mm-yy',
numberOfMonths: 2,
minDate:1
})
})
</script>
</head>
<body>
<form>
<input type=radio name="update" value="yes" checked onclick="setReadOnly(this)">
Radio1 <br />
<input type=radio name="update" value="no" onclick="setReadOnly(this)">
Radio2 <br />
<input name="text1" type="text">
<input name="text2" type="text">
<select name="number">
<option value="11">11</option>
<option value="12">12</option>
</select>
</form>
最佳答案
以 jQuery 方式，您必须将 setReadOnly 函数代码中的代码更改为:
function setReadOnly(obj){
if(obj.value == "yes"){
$('#text2').css('backgroundColor','#ffffff');
$('#text2').removeAttr('readOnly');
$('#text2').val('');
$('#text2').datepicker('enable');
$('#number').removeAttr('disabled');
}
else {
$('#text2').css('backgroundColor','#eeeeee');
$('#text2').attr('readonly','readonly');
$('#text2').val('Not applicable!');
$('#text2').datepicker('disable');
$('#number').attr('disabled',true);
}
}
编辑:虽然上面的代码工作得很好，正如@Deviant 所指出的，相关的方法可以链接起来以充分利用 jQuery 的强大功能。
function setReadOnly(obj){
if(obj.value == "yes"){
$('#text2').css('backgroundColor','#ffffff')
.removeAttr('readonly')
.val('')
.datepicker('enable');
$('#number').removeAttr('disabled');
}
else {
$('#text2').css('backgroundColor','#eeeeee')
.attr('readonly','readonly')
.val('Not applicable!')
.datepicker('disable');
$('#number').attr('disabled',true);
}
}
关于jquery - 如何在单选按钮上禁用 jquery 日期选择器，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/824256/