jquery附加到输入值答案

【问题标题】：jquery append to input valuejquery附加到输入值
【发布时间】：2011-10-16 11:29:11
【问题描述】：

这是我的表单遇到的最后一个问题（希望如此）

我想要做的是将 var size 附加到名为 my-item-name

的隐藏输入中

我已经尝试添加这个

form.find('[name=my-item-name]').append(size.val());

但它不起作用。

将大小 val 附加到输入的正确方法是什么？

<form method="post" action="" class="jcart">
    <fieldset>
        <input type="hidden" name="jcartToken" value="13823c48f896c49403465fcce9f135ac" />

        <input type="hidden" name="my-item-id" value="12" />
        <input type="hidden" name="my-item-price" value="15.99" />
        <input type="hidden" name="my-item-url" value="http://yahoo.com" />
        <input type="hidden" name="my-item-name" value="Operation Braveheart hooded sweatshirt" />
        <ul>
            <li>
                <select name="my-select" id="foo12">
                    <option value='Small'>Small</option>
                    <option value='Medium'>Medium</option>
                    <option value='Large'>Large</option>
                    <option value='X-Large'>X-Large</option>
                </select>
            </li>
            <li>Price: $<span id="price12" class="price">15.99</span></li>
            <li>
                <label>Qty: <input type="text" name="my-item-qty" value="1" size="3" /></label>

            </li>
        </ul>

        <input type="submit" name="my-add-button" value="add to cart" class="button" />
    </fieldset>
</form>                
<script type="text/javascript">
    var item_prices_by_size12 = { "Small": { "Price": "15.99", "ItemId": "9-1" },"Medium": { "Price": "16.99", "ItemId": "9-2" },"Large": { "Price": "17.99", "ItemId": "9-3" },"X-Large": { "Price": "18.99", "ItemId": "9-4" }};
    $(function() {

        $('#foo12').change(function() {

            var form = $(this).parents('form');

            // Size is whatever the value the user has selected
            var size = $(this).val();

            // Determine the correct price and item ID based on the selected size
            var price12  = item_prices_by_size12[size].Price,
            itemId = item_prices_by_size12[size].ItemId;

            form.find('#price12').text(price12);

            form.find('[name=my-item-price]').val(price12);

            // Update the item ID
            form.find('[name=my-item-id]').val(itemId);

            form.find('[name=my-item-name]').append(size.val());

        });
    });
</script>

【问题讨论】：

追加是什么意思？
是的，你不追加一个值到输入，你设置它selector.val('New value');
如果这是一个购物车，并且您想将多个产品发送到后端，那么您应该使用my-item-id[]、my-item-price[]等。

标签： php jquery append

【解决方案1】：

这样做，

var prev= $('[name=my-item-name]').val()
$('[name=my-item-name]').val(prev+" "+size);

【讨论】：

size 已经是当前对象的值，所以不能调用 val()

【解决方案2】：

如果你的意思是连接：

  $('[name=my-item-name]').val($('[name=my-item-name]').val()+""+size);

（读取你的代码大小已经是对象的val所以不能调用size.val()）

【讨论】：

【解决方案3】：

append: "将参数指定的内容插入匹配元素集中每个元素的末尾。"

你想要做的是附加到我认为的值？

var value = form.find('[name=my-item-name]').val();
form.find('[name=my-item-name]').val(value + size);

【讨论】：

那是现货。正是我的想法，但不知道如何
刚刚尝试过，它们都按照我的预期进行，但不是在 change() 事件上更改大小 val，而是在我做出选择后，它连接到之前的大小 val，提供 Small Medium大而不变。更改事件完成后如何清除 val？

【解决方案4】：

将值附加到表单输入的更好解决方案：

var attachedValue = [];

//add element to attachedValue array
attachedValue.push(size.val());
$(element).val(attachedValue);

result: 6666,5555,2222   

// remove element from array;
// remove 5555 element from array
var index = attachedValue.indexOf(size.val());
if (index > -1) {
    attachedValue.splice(index, 1);
}
$(element).val(attachedValue);

result 6666,2222

your form then would look like :
<input type="hidden" value="6666,2222" name="my-item-name">

【讨论】：