复选框启用只读输入不起作用
复选框启用只读输入不起作用
提问于 2018-08-08 04:17:36
有没有人知道为什么这不起作用？它不会在未选中复选框时将输入字段设为只读。
到目前为止，我已经遵循了所有的在线建议，并阅读了很多建议，但即使我遵循了我所能遵循的，它也不起作用，但是它没有抛出任何错误。
如果有人能看到原因的话，那就太好了。
<div class='div1'>
<input type="checkbox" class='Xcheckbox' id="byname" name="searchforname" title='Search For All Listings With Sellers Name' value="sellersname" onclick="chbxX(this); <?php $extrasearch==='sellersname'; ?>" <?php if ($extrasearch==='sellersname' ): ?> checked="checked"
<?php endif; ?> >
<label for="byname" class='nameheader' title='Search Date Range'>
<b>Seller's Name</b>
</label>
<input type="text" id='sellersname' name="SellersName" placeholder="Sellers Name" class="sellersname" title='Type The Sellers Name' value="<?php echo $sellersname ?>">
</div>
<script>
$(function() {
if ($("#byname").prop('checked') == false) {
document.getElementById("sellersname").setAttribute("readonly", true);
} else {
document.getElementById("sellersname").removeAttribute("readonly");
}
});
</script>回答 4
Stack Overflow用户
发布于 2018-08-08 05:10:35
<div style="position:relative; width:fit-content; height:fit-content; float:left; clear:both; margin-top:30px;">
<input type="checkbox" class='Xcheckbox' id="byname" name="searchforname" title='Search For All Listings With Sellers Name' value="sellersname" onclick="chbxX(this); <?php $extrasearch==='sellersname'; ?>" <?php if ($extrasearch==='sellersname'): ?> checked="checked" <?php endif; ?> ></input>
<label for="byname" class='nameheader' title='Search Date Range' ><b>Seller's Name</b></label>
<input type="text" id='byname2' name="SellersName" placeholder="Sellers Name" class="sellersname" title='Type The Sellers Name' disabled='true' value="<?php echo $sellersname ?>" ></input>
</div>
function chbxX(objX)
{
var that = objX;
(objX);
if(document.getElementById(that.id).checked === true) {
document.getElementById('byname').checked = false;
document.getElementById('bynumber').checked = false;
document.getElementById('bylistingid').checked = false;
document.getElementById('byname2').disabled = true;
document.getElementById('bynumber2').disabled = true;
document.getElementById('bylistingid2').disabled = true;
}
document.getElementById(that.id).checked = true;
document.getElementById(that.id+"2").disabled = false;
}谢谢大家的帮助。这真的很有帮助。
Stack Overflow用户
发布于 2018-08-08 05:24:32
你只需要反转你的条件：
$(function() {
/* event handler added just for debugging purpose */
$('#byname').on('change', function(e) {
$('#sellersname').prop('readonly', !$("#byname").prop('checked'));
});
});#sellersname[readonly]{
background-color:#ccc;
border-width:1px;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='div1'>
<input type="checkbox" class='Xcheckbox' id="byname" name="searchforname" title='Search For All Listings With Sellers Name' value="sellersname" />
<label for="byname" class='nameheader' title='Search Date Range'><b>Seller's Name</b></label>
<input type="text" id='sellersname' name="SellersName" placeholder="Sellers Name" class="sellersname" title='Type The Sellers Name' />
</div>
Stack Overflow用户
发布于 2018-08-08 05:28:53
下面是你如何做到这一点的。我确实删除了php代码，否则下面的代码示例将无法正常运行。
使用此选项时，请确保在输入上设置初始值。因此，如果您的复选框将在页面加载时取消选中，请确保将输入设置为只读属性。
$(function() {
$('input[type="checkbox"]').on('click', function() {
if ($("#byname").prop('checked') == false) {
$("#sellersname").prop('readOnly', true);
} else {
$("#sellersname").prop('readOnly', false);
}
});
});input:-moz-read-only {
/* For Firefox */
background-color: #ccc;
}
input:read-only {
background-color: #ccc;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='div1'>
<input type="checkbox" class='Xcheckbox' id="byname" name="searchforname" title='Search For All Listings With Sellers Name' value="sellersname">
<label for="byname" class='nameheader' title='Search Date Range'>
<b>Seller's Name</b>
</label>
<input type="text" id='sellersname' readonly name="SellersName" placeholder="Sellers Name" class="sellersname" title='Type The Sellers Name' value="Donna">
</div>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51734760
复制相关文章
相似问题