0

当用户单击添加更多选项时,将使用 javascript 创建一个 from document.getElementById('addmore').innerHTML... 多次显示表单非常有用。我每次都添加一个唯一编号,以便为每个提交的字段创建唯一 ID。我有一个复选框,如果选中,则需要显示另一个字段才能填写:

document.getElementById('addmore').innerHTML += '<p><div class="required">*Type of Folder</div><label for="it09" class="hidelabel">Content Drive</label><input name="request['+fields+'][Type of Folder:]" id="cbpathCDB'+fields+'" type="checkbox" value="Content Drive" class="required" /><strong>Content Drive</strong> (A: drive)<br /><div id="pathCDB'+fields+'"><label for="newpathCDB"><span class="req">*Path to Content Drive Folder</span></label><input name="request['+fields+'][Path to Content Drive Folder:]" type="text" id="npcdb'+fields+'" size="50" class="required"/><br /><small>Path of folder to be created on Content Drive (A: drive)<br><em>(example: A:\drivefolder</em></small><br /></div></p>';

我尝试了多种方法(包括 jquery)来获取下一个 div,pathCDB+fields,以显示复选框何时被选中。如果没有 + 字段,它可以正常工作......请参阅http://jsfiddle.net/kuVzV/4/但是,当我添加字段时,它无法使用复选框显示/隐藏。

但是,当创建表单时,div 最初不会显示,就像它不应该显示一样......所以我知道 ID 是正确的。根据 Firebug,它显示了正确的 ID,该字段显示了正确的 #,即创建...

我现在不知所措。

如果选中复选框以动态创建多个输入,有关如何显示/隐藏此 div 的任何建议?

4

1 回答 1

0

尝试检查 jQuery .show()和 Jquery .hide ()。我相信这就是您正在寻找的。

$(document).ready(function(){
    $("#cbpathCDB1").on('click', $("#cbpathCDB1 input[type=checkbox]").is(":checked"), someFunction);

});
function someFunction(event){
    if (event.target.checked){
         $("#pathCDB1").hide('slow');
    }
    else{
       $("#pathCDB1").show('slow');
    }
}​

jsfiddle http://jsfiddle.net/FERMIS/7ThtT/6/这是一个包含多个字段的示例。

于 2012-06-26T16:26:02.713 回答