javascript - 如何使用 JQuery 填充文本字段

Question

我有以下 DIV:

<div id="modalUpdate">
    <div class="modal-content">
        <div class="header">
            <h2>Update Item in Your Shopping Cart</h2>
        </div>
        <div class="copy">
            <label>Item:</label>
            <select id="itemChoice">
                <option value="Wine" selected>Wine</option>
                <option value="Shot">Shot</option>
                <option value="Beer">Beer</option>
            </select>
            <br /><span id="spanPrice"></span><br /><br />

            <label>Quantity:</label>
            <input type="text" id="quantity" name="quantity" placeholder="10">

            <label>Price:</label>
            <input type="text" id="price" name="price" placeholder="$10.00">

        </div>
        <div class="cf footer">
            <input type="button" value="Cancel" id="cancelUpdate"><input type="button" value="Update Item" id="updateTable">
        </div>
    </div>
    <div class="overlay"></div>
</div>

我想使用 JQuery 访问 SELECT 和每个文本框，以便我可以将值填充到其中。我尝试了以下方法:

var values = $('#'+p.id+' td').map(function(i,c){ return $(c).text(); }).get();
alert(p.id);
alert(values);
$("#modalUpdate #modal-content .copy #itemChoice").val(values[0]);
$("#modalUpdate #modal-content .copy #spanPrice").text("Each: " + values[1]);
$("#modalUpdate #modal-content .copy #quantity").val(values[2]);
$("#modalUpdate #modal-content .copy #price").val(values[3]);

警报显示正确的值，但由于某种原因未填充字段。

如何修复代码以使其正常工作？

Answer 1

modal-content 是一个类，因此 jquery 中的选择器应如下所示:

$("#modalUpdate .modal-content .copy #itemChoice").val(values[0]);

话虽如此，由于 ID 选择器只能选择单个元素(根据定义，ID 在页面上必须是唯一的)，因此您可以直接使用子 ID:

$("#itemChoice").val(values[0]);
$("#spanPrice").text("Each: " + values[1]);
$("#quantity").val(values[2]);
$("#price").val(values[3]);