Question

看到我的问题在这里回复并成功后，转换到我的脚本时出现了问题：我有一个被克隆的下拉列表，显示它在一个div上的价值。问题是当我克隆它时，下面的下拉列表不起作用，第一个更新所有剩余的。代码：

添加

<div class="row">    
    <div class="products-row">
        <div class="col-xs-12 nopadding">
            <div class="col-xs-2">
                <input type="text" id="number1" class="form-control" value="1" />
            </div>
            <!-- if i remove the div below and leave only the select, it works -->
            <div class="col-xs-6" >
                <select name="total-checkout" id="name" class="form-control product-name select" >
                    <option value="25" >A</option>
                    <option value="50" >B</option>
                    <option value="75" >C</option>
                </select>
            </div>
            <div class="col-xs-2">
                <div class="tags">25</div>
            </div>
        </div>
    </div>
</div>

jQuery的：

var count = 0;

$('#add-more').click(function(){

var id = $(".row:last").attr('id');
var appendDiv = $($(".products-row:last")[0].outerHTML);
    appendDiv.attr('id', ++id).insertAfter(".products-row:last");        
});

$('#name').change(function(event) {
$('.tags').html($('#name').val());
});
$(document).on('change', '.select', function() {
    $(this).next(this).html($(this).val());
});

工作jsFiddle： http://jsfiddle.net/QuadDamage/p843nc9j/

如果我从<div class="col-xs-6">周围移除<select>，则输出将显示为未格式化但正确更新div。

提前致谢。

Answer 1

在我看来，如果您需要此代码，则定位.col-xs-2 .tags

$(this).parent().next().find('.tags').html($(this).val());

在div内部，jQuery .next（）接下来不起作用

1 个答案: