当我点击对应的复选框时，如何让不可编辑的文本框可编辑

Question

有一个复选框和一个不可编辑的文本框对应于它。当我点击复选框时，相应的不可编辑文本框应该成为一个可编辑的文本框。我怎样才能做到这一点？

Answer 1

此代码实际上工作正常，并且可以使用。

这是形式的东西：

<form id="myGame" name="myGame" action="" method="post"> 
<input type="radio" name="checkme" id="checkme" onClick="openTheHouse();" >Open Sesame 
<input name="open_id" id="openid" type=text disabled="disabled"> 
</from> 

和脚本：它实际上是相当冷静，没有在这个脚本复杂。

<script type="text/javascript"> 
function openTheHouse() 
{ 

if(document.myGame.checkme.checked == true) 
{ 
document.myGame.openid.disabled = false ; 
} 

} 
</script>         

这就是它，全部完成。当然，我相信它的作品。

Answer 2

基本上是：

$('#some-checkbox').click(function() { 
    $('#some-textfield').prop('disabled', !$(this).is(':checked')); 
}); 

现在，你如何去寻找相应的文本框取决于您的标记。一种方法是给文本框添加一个类，该类是复选框的ID。将其应用于所有的复选框可能是这个样子：

$(':checkbox').click(function() { 
    var box = $(this); 
    $('.' + box.attr('id')).prop('disabled', !box.is(':checked')); 
}); 

否则，文本字段可以由它的位置位于DOM：

<div class="wrapper"> 
    <input type="checkbox"> 
    ... 
    <div> 
     <input type="text" disabled="disabled" /> 
    </div> 
</div> 

然后，您可以这样做：

$(':checkbox').click(function() { 
    var box = $(this); 
    box.closest('.wrapper').find('input[type=text]').prop('disabled', !box.is(':checked')); 
});