在Jquery中隐藏/取消隐藏克隆的表单元素。怎么样?

时间:2010-11-04 22:36:16

标签: jquery forms javascript-events

我可以在Jquery中找到许多隐藏和取消隐藏表单元素的示例。我还可以在Jquery中找到许多克隆表单元素的例子。但有没有办法在Jquery中隐藏/取消隐藏克隆的表单元素?

例如,假设我有3个产品类别(可从下拉框中选择)。这些产品类别中的每一个都有自己的与之相关的表单元素。我想让用户能够多次查询1个或所有产品类别。

例如,假设用户选择产品类别。与他们选择的产品类别相关联的表单元素将取消隐藏。用户可以输入这些表单元素并提交表单...或者他们可以选择从相同或其他产品类别中再次选择并填写与其第二个选择,第三个选择等相关的表单元素等。

这有意义吗?

帮助?!

绝对的新手

2 个答案:

答案 0 :(得分:1)

我不清楚克隆了哪些元素。也许你可以详细说明一下。

但是,如果您可以为共享功能的任何元素(例如,应该隐藏在同一个元素中)分配“类”,则可以隐藏具有该类的所有元素。也许select选项有class =“product_cat_1”,并且有3个div也有class =“product_cat_1”..那么你可以使用jquery隐藏所有div的class =“product_cat_1”


编辑: 我用于你的情况的一个技巧是将每个克隆元素块包装在一个容器div中,并带有唯一的id:

<div id="new_item_1">
    <select class="productcat1" name="productcat1[]">...</select> 
</div>

然后在克隆字段时使用jQuery,您可以添加相对于该父容器的所有javascript:

$('#new_item_1 .productcat1').select(...);

答案 1 :(得分:1)

如果将克隆的表单元素包装在fieldset中,并在同一字段集中包含remove按钮(或链接或其他),则可以调用:

$('.hideButtonClass').live('click',
function(){
  $(this).parent().hide();
})

JS Fiddle demo