javascript - 使用相同名称定位多个输入字段

Question

我有一些

<input type="text" name="price[]" value="100">
<input type="text" name="price[]" value="50">
<input type="text" name="price[]" value="10">
<input type="text" name="price[]" value="90">

我也有一个输入字段

<input type="text" name="Add" value="">

我想

1. 每个 price[] 输入字段旁边都有自己的添加按钮，它将从该特定 price[] 输入字段中获取值
2. 将添加输入字段中的值添加到其中
3. 最后更新该特定价格 [] 输入字段的值

我怎样才能做到这一点？

Answer 1

遍历价格 [] 框以向它们添加按钮并将价格 [] 的值设置为按钮，像这样

<input type="text" name="price[]" value="100">
<input type="text" name="price[]" value="50">
<input type="text" name="price[]" value="10">
<input type="text" name="price[]" value="90">

<script type="text/javascript">
$(document).ready(function() {
    $('input[name="price[]"]').each(function(i) {
        $(this).after('<button class="additionButton" price="'+$(this).val()+'">'+$(this).val()+'</button>');
    });
    //click
    $(".additionButton").on('click',function() {
        //original price, set on load
        alert($(this).attr('price'));
        //price in the input-field before the button (could be changed, think this is the idea)
        alert($(this).prev('input').val());
    });
});
</script>

其余的，我不确定你的意思，“添加”没有价值，你真的想要某种计算吗？但是试试自己，这至少是迭代。