单击复选框后，将出现一个文本框

Question

<script type="text/javascript" language="javascript">
function enabletxt(){
    document.getElementById("chkAssociation").innerHTML="<input type='text' value=''>"
}
</script>
Hobbies:  <input type="checkbox" name="hobbies" value="Dancing">Dancing
<input type="checkbox" name="hobbies" value="Painting">Painting
<input type="checkbox" name="hobbies" value="Others" onChange="javascript:enabletxt();" ID="chkAssociation"  runat="server" />Others

Answer 1

    <input type="checkbox" name="hobbies" value="Dancing">Dancing
    <input type="checkbox" name="hobbies" value="Painting">Painting
    <input type="checkbox" name="hobbies" value="Others"  onclick="OnChangeCheckbox (this)"ID="chkAssociation"/>Others
    <input type="textbox" Id="txtToggle" style="display:none"/>
    <script type="text/javascript">
    function OnChangeCheckbox (checkbox) {
        if (checkbox.checked) {
            document.getElementById('txtToggle').style.display="block"; 
        }
        else {
            document.getElementById('txtToggle').style.display="none"; 
        }
    }
   </script>

Answer 2

你能做什么：

function enableText(checkBox) {
    if (checkBox.nextSibling.tagName != 'INPUT') {
        var input = document.createElement('input');
        input.type = "text";
        checkBox.parentNode.insertBefore(input, checkBox.nextSibling);
    }
}

和

<input type="checkbox" name="hobbies" value="Dancing" onchange="enableText(this)">

Answer 3

这是你在找什么？

@dt

Answer 4

<script type="text/javascript">
       function enabletxt(){
        if(document.getElementById('chkAssociation').checked) {
           $('#chkAssociation2').html('<input type="text" value="">');
        }else{
           $('#chkAssociation2').html('');
        }   
       }
    </script>
    <input type="checkbox" name="hobbies" value="Dancing">Dancing
    <input type="checkbox" name="hobbies" value="Painting">Painting
    <input type="checkbox" name="hobbies" value="Others" onChange="javascript:enabletxt();" ID="chkAssociation"  runat="server" />Others
    <div id= "chkAssociation2"></div>