关于复制的div如何能够源div中对应标签的事件一起copy过来？
0
悬赏园豆：20
[已解决问题]
解决于 2015-04-10 17:44
最近在做一个表单，需要提交多组数据，于是就做了个复制相应DIV的操作，然后在其中填写数据，最后一起提交，可是我div中有两个下拉框是联动的
就是那个欺诈手法和欺诈明细，因为不同的欺诈手法对应不同的欺诈明细，第一个div是可以实现选择不同欺诈手法，就自动绑定对应的欺诈明细，可是当我复制了它的div以后，下面的那一个欺诈手法就没有了联动效果，为什么呢？如何让复制过来的标签同样拥有联动效果，下面是我的联动脚本
$("#dpFraudMeans").change(function(){
var data = $(this).val();
$.ajax({
data:{act:"getDetails",data:data},
url:"DataAction.ashx",
dataType:"json",
method:"get",
error:function(){
alert("未知错误,请与管理员联系2925");
},
success:function(data){
var strOptions = "";
for(var i=0; i<data.length; i++){
strOptions = strOptions + "<OPTION value='" + data[i]["Details_ID"] + "'>" + data[i]["Fraud_Means_Detail"] + "</OPTION>";
}
$("#dpFraudDetail").html(strOptions);
}
})
})
$("#dpFraudMeans")这个是欺诈手法，$("#dpFraudDetail")这个是欺诈明细，如何解决这样的问题，或者说对于这种要存取多组数据的情况，有什么比较好解决的办法呢？
最佳答案
0
第一个是不能用id，html中遵循id不重复。
二个是使用事件冒泡绑定方式：
$('#容器').on('change', '.dpFraudMeans', function(){
var $self = $(this);
$.ajax({}).success(function(data){
var $select2 = $self.parent().find('.select2:eq(0)');
//做数据绑定，这里需要对应$self来找需要联动的对象
});
})
收获园豆：20
恩，你说的很对，刚好我已经就是这样处理的，可是我就是选不中那个select的，你帮我看看这样的html该用什么去选中我想要的select呢？
<td> <select name="dpFraudMeans" id="Select1"> <option value="1">白马欺诈</option> <option value="2">价格欺诈</option> <option value="3">修改合同信息</option> </select> <label style="color: Red;"> * </label> </td> <td> 欺诈明细 </td> <td> <select name="dpFraudDetail" id="Select2"> <option value="1">销售接受客户借用他人名义申请</option> </select> <label style="color: Red;"> * </label> </td>
我用
$($(this).parent().next().next().children()[0]).html(strOptions)；或者
$(this).parent().next().next().children()[0].html(strOptions);怎么都不行
能帮我写一下那个选择器语句么- -！！
@车上有首长: $secondSelectElement = $self.parents('tr').find('[name=dpFraudDetail]:eq(0)');
@幻天芒: 你这样不起作用我用$self.parents('tr').find('[name=dpFraudDetail]:eq(0)').html(strOptions)并没有达到绑定数据的作用，原来的数据绑定效果都消失了
@车上有首长: 只是给你参考，你对应着来就是了。
@幻天芒:
$(".means").change(function(){
var data = $(this).val();
$this = $(this);
$.ajax({
data:{act:"getDetails",data:data},
url:"DataAction.ashx",
dataType:"json",
method:"get",
error:function(){
alert("未知错误,请与管理员联系2925");
},
success:function(data){
var strOptions = "";
for(var i=0; i<data.length; i++){
strOptions = strOptions + "<OPTION value='" + data[i] ["Details_ID"] + "'>" + data[i]["Fraud_Means_Detail"] + "</OPTION>";
}
$this.parent().next().next().find(".detail").html(strOptions);
}
})
})
用上面的js可以实现联动效果，可是问题来了，copy之后的div中的select却不能触发这个change事件了，我的select已经设置了class="means"了啊，复制以后难道这个class会丢失？没有丢失的话，我上面的js应该就是对所有css样式为means的元素绑定change事件吧？为什么复制过后的不能触发这个change事件？
@车上有首长: 你的绑定方式只针对绑定时界面上存在的元素。你重新复制元素后，是没有复制事件的。我建议你使用事件冒泡来捕获呀~比如 $(document).on('change','.means',function(){//相关代码})
其他回答(2)
0
把id改为class
我也想过，这样的话我所有的欺诈手法下拉框就都有了联动的事件，问题是我的欺诈明细绑定option是包含在那个change事件里面的，那么它该如何处理，没处理的话，任何一定欺诈手法下拉框进行change，都会引发所有div中欺诈明细的改变
@车上有首长: 通过上下文关系找下一个select， 而不是用id找。
比如$(this).next().next()之类的。 或者$(this).parent().find('.xx')
0
听楼上的，因为你复制相应DIV后 ，id重复了。
