0

我对 Jquery 很陌生，需要一点指导来开始设置订单“队列”系统。简短的例子会有所帮助，但我正在寻找更多的总体大纲，并且知道我想要做的事情是否可能：

1）有一个“主” div，您可以在其中选择项目并输入项目的数量并选择所有修饰符（我可以使用文本和复选框来完成所有这些操作）。然后单击“添加”按钮，它将订单摘要（可能是数量和商品总价）添加到另一个“排队”到一边的 div。

2）点击“添加”后，“主” div 将清除所有框并允许我添加另一个项目。

3）有能力点击小div中的“汇总”，重新显示订单项。

4

1 回答 1

0

这是您所要求的简化版本，它应该向您展示使用 jQuery 从页面获取值的基础知识：

HTML：

Select a Product: <select id="product">
    <option>Photoshop CS6</option>
    <option>Photoshop Elements</option>
    <option>iPhoto</option>
</select><br>
Digital Download <input id="digitalDownload" class="options" type="checkbox"><br>
Student Discount <input id="studentDiscount" class="options" type="checkbox"><br>
<br>
<button id="add">Add to Order</button><br>
<br>
<div id="summary"></div>

Javascript：

$("#add").click(function() {
    // gather current order info
    var order = [];
    order.push($("#product").val());
    order.push("Digital Download: " + $("#digitalDownload").prop("checked"));
    order.push("Student Discount: " + $("#studentDiscount").prop("checked"));
    // put order info into summary
    $("#summary").append("<div>" + order.join(", ") + "</div>");
    // clear previous checked values
    $(".options").prop("checked", false);
});

在这里工作演示：http: //jsfiddle.net/jfriend00/Rjmbx/

于 2013-01-29T00:47:54.230 回答