-2

可能重复：
这个 Javascript 有什么问题？购物车

这个javascript中有一些东西根本不允许它工作。简化也会很棒:)

var computer = new Array();

computer[0] = "10001, Nvidia Geforce GTX 690, 1200";
computer[1] = "10002, Raedon HD 7950, 450";
computer[2] = "20001, Ivy Bridge i7 3770, 400";
computer[3] = "20002, Ivy Bridge i7 3770k, 420";
computer[4] = "20003, Sandy Bridge i7 2700k, 340";
computer[5] = "20004, Bulldozer FX-8150, 270";
computer[6] = "30001, Antec eleven-hundred, 120";
computer[7] = "30002, Coolermaster HAF-X, 170";
computer[8] = "30003, Antec three-hundred, 50";
computer[9] = "30004, Corsair 550D, 160";
computer[10] = "40001, INTEL-ASrock fatal1ty Z77 Professional Motherboard, 250";
computer[11] = "40002, INTEL-ASrock Z77 extreme9 Motherboard, 350";
computer[12] = "40003, AMD-ASrock fatal1ty 990FX Professional Motherboard, 240";
computer[13] = "40004, AMD-ASUS Sabertooth 990FX Motherboard, 260";

检查所有复选框功能

function check() { 

var leftSide = document.getElementById('table_container_left');
var inputs = leftSide.getElementsByTagName('input');
for (x=0; x<=inputs.length-1; x++)  {
    if(inputs[x].type == 'text')  {
        inputs[x].value = 1;
    } else {
        inputs[x].checked = true;
    }
}
}

取消选中所有复选框功能

function uncheck() { 

var leftSide = document.getElementById('table_container_left');
var inputs = leftSide.getElementsByTagName('input');
for (x=0; x<=inputs.length-1; x++)  {
    if(inputs[x].type == 'text')  {
        inputs[x].value = 0;
    } else {
        inputs[x].checked = false;
    }
}
}

将选中的物品添加到购物车

function addItems() { 
var leftSide = document.getElementById('table_container_left');
var rightSide = document.getElementById('table_container_right');
var inputs = leftSide.getElementByTagName('input');
var totalPrice = 0;
var basketTable = "<h3>My Basket:</h3><table><thead><tr><th>Item</th><th>Quantity</th><th>price</th><th>Sub-total</th></tr></thead><tbody>";
for (x=0; x<=inputs.length-1; x++)  {
    if(inputs[x].type == 'checkbox' && inputs[x].checked == true)  {
        var quantity = ParseFloat(inputs[x+1).value);
        var itemName = computer[x/2].split(",")[1];
        var itemPrice = parseFloat(computer[x/2].split(",")[2])
        var itemTotal = parseFloat(quantity*itemPrice);
        totalPrice += itemTotal;
        basketTable += "<tr><td>"+itemName+"</td><td>"+quantity+"</td><td>$"+itemPrice+"</td><td>$"+itemTotal+"</td></tr>";
    }
}
basketTable +=" <tr><td> colspan='3'><b>Total:</b></td><td><b>$"+totalPrice+"</b></td></tr></tbody><table>";
rightsSide.innerHTML = basketTable;
}

检查项目时将数量更新为 1

function updateQty(id)  {

var targetRow = document.getElementById(id);
var qtyBox = targetRow.getElementsByTagName('input')[1];
if (qtyBox.value == 0)  {
    qtyBox.value = 1;
} else {
    qtyBox.value = 0;
}
}

这是所要求的 HTML

    <form name="myForm" action="index.html" method="post">

        <div id="table_container_left">

                    <button onclick="check();">Select All</button>

                    <button onclick="uncheck();">Unselect All</button>

                    <button onclick="addItems();">Add Items</button>

            <table>

                <thead>

                        <th><u>Item Code</u></th>

                        <th><u>Item</u></th>

                        <th><u>Qty</u></th>

                        <th><u>Price</u></th>

                </thead>

                <tbody>



<script type="text/javascript">

for(x=0; x<=computer.length-1; x++) {

document.write("<tr id='"+x+"'><td><label><input type='checkbox' name='item' value='"+x+"'     onclick='updateQty('"+x+"');'/> "+computer[x].split(",")[0]+"</label></td><td>"+computer[x].split    (",")[1]+"</td><td> <input name='qty' id='qty' type='textbox' value='0' onchange='qtychange    ('"+x+"');'/></td><td>$"+computer[x].split(",")[2]+"</td></tr>");

}

</script>







                </tbody>

            </table>

        </div>



        <div id="table_container_right">

            <table id="shoppingBasket">













                    <input name='selectAll' type='button' value='Select All' onclick="itemSelected();"/>

                    <input name='clearAll' type='button' value='Clear All' onclick=""/>

                    <input name='removeItem(s)' type='button' value='Remove Item(s)' />

                    <input name='sortItemCode' type='button' value='Sort by Item Code' disabled='disabled' />

                    <input name='sortPrice' type='button' value='Sort by Price' disabled='disabled' />

                </tbody>

            </table>

        </div>



</div>



</form>
4

3 回答 3

1

A few notes, which may or may not fix the problem if applied:

  • There's a ParseFloat instead of a parseFloat,
  • You often reference attributes as if they were integers, although they should be strings,
  • There's a computer[x/2] which might result in a decimal array index,
  • Variables are repeatedly declared within the for loop,
  • innerHTML is used instead of the DOM.
于 2012-07-18T01:16:20.470 回答
0

(Not an answer.)

Here's one simplification, with at least two caveats:

  1. Poorly-named function, since it does something other than simply setting checkboxes.
  2. I'd recommend using a JS framework that simplifies DOM manipulation.
function check() {
    setChecks(false);
}

function uncheck() {
    setChecks(true);
}

function setChecks(checked) {
    var leftSide = document.getElementById('table_container_left');
    var inputs = leftSide.getElementsByTagName('input');
    var textValue = checked ? "1" : "0";
    var x;

    for (x = 0; x < inputs.length; x++)  {
        if (inputs[x].type == 'text')  {
            inputs[x].value = textValue;
        } else {
            inputs[x].checked = checked;
        }
    }
}

I'd consider using immediate array initialization and objects. Also, the object holding the computers should be called that–computers. It's not a computer. It's a collection of them; plural.

var computers = [
  { id: "10001", name: "Nvidia Geforce GTX 690", price: 1200 },
  { id: "10002", name: "Raedon HD 7950", price: 450 },
  // ...
];
于 2012-07-18T01:20:04.937 回答
-1

给您使用数组，为什么不全力以赴并真正使用它们呢？

computer[0] = [10001, "blah blah blah"];
computer[1] = [10002, "foo bar baz"];

等等？这就像您购买一个精美的橱柜，然后将其用作镇纸。

于 2012-07-18T01:11:52.760 回答