Javascript 如何使函数仅与每个克隆的div单独运行，而不与原始div一起运行

我需要在下拉列表更改时运行jquery函数，但是当我克隆

div

元素并且克隆元素的下拉列表更改时，效果会发生在第一个

div

中

$（document）.on（'change'，'#extrabed'，function（）{
var value2=$（this.val（）；
var toAppend2=''；
var$container2=$（this）.同级（“#container2”）
开关（值2）{
案件‘否’：
toAppend2=（函数（）{
$（“#extbed”）.hide（）；
});
$container2.html（toAppend2）；
返回；
打破
案例“是”：
toAppend2=（函数（）{
$（“#extbed”）.show（）；
});
$container2.html（toAppend2）；
返回；
打破
违约：
返回；
}
});


您需要使用类而不是
id
，因为当您克隆将导致重复标识符的元素时，会导致HTML代码无效

因此，当您按类更改id时，必须将类
extbed
传递给
x/y
函数，因为如果您将
.extbed
直接用作选择器，它将选择该类的所有元素，这将导致同时显示隐藏所有克隆和原始实例

注意：使用以下方法隐藏克隆实例中的
.extbed
部分：

$clone.find('.extbed').hide().find('input').val('');


$（文档）.ready（函数（）{
var genroomid=2；//将0更改为要开始的数字
$（“.add行”）。单击（函数（）{
var$clone=$（“ul.personal details”）.first（）.clone（）；
var$input=$clone.find（“#roomid”）；
$input.val（genroomid）.attr（'genroomid'，+genroomid）//使用所需的任何字符串更改fileid
$clone.find（'.extbed'）.hide（）.find（'input'）.val（''）；
$clone.append（“-”）；
$clone.insertBefore（“.addrow”）；
genroomid++；//将id增加1
});
$（.cloned removed div”）。在（“单击”，“删除行”，函数（）上{
$（this.parent（）.remove（）；
genroomid--；
});
var x=（函数（extbed）{
extbed.hide（）；
$（“.divvisextbed”）.val（'0'）；
});
变量y=（函数（extbed）{
extbed.show（）；
$（“.divvisextbed”）.val（'1'）；
});
//显示加床客人信息代码
$（文档）.on（'change'，'.extrabed'，function（）{
var value2=$（this.val（）；
var toAppend2=''；
var$container2=$（this.sippines（'.container2'）；
var extbed=$container2.find（“.extbed”）；
开关（值2）{
案件‘否’：
toAppend2=x（外床）；
$container2.html（toAppend2）；
返回；
打破
案例“是”：
toAppend2=y（外床）；
$container2.html（toAppend2）；
返回；
打破
违约：
返回；
}
});
});


加床
加床
不
对
先生
太太
小孩
婴儿

+新客户

您需要使用类而不是
id
，因为当您克隆将导致重复标识符的元素时，会导致HTML代码无效

因此，当您按类更改id时，必须将类
extbed
传递给
x/y
函数，因为如果您将
.extbed
直接用作选择器，它将选择该类的所有元素，这将导致同时显示隐藏所有克隆和原始实例

注意：使用以下方法隐藏克隆实例中的
.extbed
部分：

$clone.find('.extbed').hide().find('input').val('');


$（文档）.ready（函数（）{
var genroomid=2；//将0更改为要开始的数字
$（“.add行”）。单击（函数（）{
var$clone=$（“ul.personal details”）.first（）.clone（）；
var$input=$clone.find（“#roomid”）；
$input.val（genroomid）.attr（'genroomid'，+genroomid）//使用所需的任何字符串更改fileid
$clone.find（'.extbed'）.hide（）.find（'input'）.val（''）；
$clone.append（“-”）；
$clone.insertBefore（“.addrow”）；
genroomid++；//将id增加1
});
$（.cloned removed div”）。在（“单击”，“删除行”，函数（）上{
$（this.parent（）.remove（）；
genroomid--；
});
var x=（函数（extbed）{
extbed.hide（）；
$（“.divvisextbed”）.val（'0'）；
});
变量y=（函数（extbed）{
extbed.show（）；
$（“.divvisextbed”）.val（'1'）；
});
//显示加床客人信息代码
$（文档）.on（'change'，'.extrabed'，function（）{
var value2=$（this.val（）；
var toAppend2=''；
var$container2=$（this.sippines（'.container2'）；
var extbed=$container2.find（“.extbed”）；
开关（值2）{
案件‘否’：
toAppend2=x（外床）；
$container2.html（toAppend2）；
返回；
打破
案例“是”：
toAppend2=y（外床）；
$container2.html（toAppend2）；
返回；
打破
违约：
返回；
}
});
});


加床
加床
不
对
先生
太太
小孩
婴儿

+新客户
您无需在每次单击时设置
.container2
的html。。您只需显示或隐藏
#extbed