无法匹配/查找克隆父元素中的所有选择器 - Jquery

时间:2013-11-21 15:11:58

标签: jquery

http://jsfiddle.net/LGLtY/

我应该定位或引用父选择器,以便找到一组克隆div中的所有选择选项。我想要做的是将#rooms div中所有下拉列表中的所有值相加,并在选择一定量后创建一个警报。我可以克隆所需的部分,但值加起来只适用于第一部分。

这些变量设置为onlclick

 var num = $( '.clonedInput' ).length;      
 var newNum = new Number( num + 1 );
 var $newElem = $( '#field' + num );
 var newElemCloned = $newElem.clone(true).prop( 'id',  'field' + newNum );

我尝试将这些功能集成到函数中:

$('#rooms').find('select').change ......

我是以正确的方式解决这个问题,还是更好地使用除了改变之外的东西来找到所有选择的元素?任何帮助表示赞赏。

2 个答案:

答案 0 :(得分:1)

DEMO

这里的关键是使用jQuery on,以便后续的select附加事件处理程序。

$("#room").on("change","select",function(){
    //Rest of your stuff here
    ...

接下来要做的是在添加新房间时触发此事件。
在添加功能的末尾添加$("select","#room").first().trigger("change");
first()非常重要,因为您不需要多次提醒。

答案 1 :(得分:0)

需要使用事件委派!!!

$('#room').on('change', 'select', function () {
    var sum = 0;
    $('#room select').each(function () {
        sum += Number($(this).val());
    });
    if (sum > 5) {
        $(this).siblings().prop('disabled', 'disabled');
        $('.addRoom').prop('disabled', 'disabled');
        $('button[type="submit"]').prop('disabled', 'disabled').addClass('disabled');
    } else {
        $(this).siblings().prop('disabled', false);
        $('.addRoom').prop('disabled', false);
        $('button[type="submit"]').prop('disabled', false).removeClass('disabled');
    }
});

演示:Fiddle