这个Javascript有什么问题？购物车 [英] What is wrong with this Javascript? shopping cart

问题描述

这个javascript或者html里面有一些东西是允许复选框打勾的，但是甚至没有半秒。 （我需要检查留在那里！）我还需要additems函数才能工作

  var computer = new Array（）; 
 
电脑[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; 
电脑[6] =30001，安泰克十一，120; 
 computer [7] =30002，Coolermaster HAF-X，170; 
电脑[8] =30003，Antec三百，50; 
 computer [9] =30004，Corsair 550D，160; 
 computer [10] =40001，INTEL-ASrock fatal1ty Z77专业主板，250; 
 computer [11] =40002，INTEL-ASrock Z77 extreme9主板，350; 
电脑[12] =40003，AMD-ASrock致命990FX专业主板，240; 
电脑[13] =40004，AMD-ASUS Sabertooth 990FX主板，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]值= 1; 
} else {
 inputs [x] .checked = true; 
 
 
 $ b $ / code $ / pre 
 
取消所有复选框功能 p> 
 
 
 函数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]值= 0; 
} else {
 inputs [x] .checked = false; 
 
 
 
 
 
 $ b 
将检查项目添加到购物车
  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> <的第i;价格< /第><的第i;小计和LT; /第>< / 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>总计：< / b>< / td>< ; TD>< b取代; $ + totalPrice + < / b>< / TD>< / TR>< / tbody的><表>; 
 rightsSide.innerHTML = basketTable; 
 
  
检查商品时更新数量为1 
 
 
 函数updateQty（id）{
 
 var targetRow = document.getElementById（id）; 
 var qtyBox = targetRow.getElementsByTagName（'input'）[1]; 
 if（qtyBox.value == 0）{
 qtyBox.value = 1; 
} else {
 qtyBox.value = 0; 
 
 
 
 
 $ b 
以下是HTML的要求
 < form name =myFormaction =index.htmlmethod =post> 
 
< div id =table_container_left> 
 
< button onclick =check（）;>全选< / button> 
 
< button onclick =uncheck（）;>取消选择全部< / button> 
 
< button onclick =addItems（）;>添加项目< / button> 
 
< table> 
 
< thead> 
 
< th>< u>商品代码< / u>< / th> 
 
< th>< u>项目< / u>< / th> 
 
< th>< u>数量< / u>< / th> 
 
< th>< u>价格< / 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 +'）;'/>计算机[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> $ +计算机[X] .split（， ）[2] + < / TD>< / TR>中）; 
 
} 
 
< / script> 
 
 
 
 
 
 
 
< / tbody> 
 
< / table> 
 
< / div> 
 
 
 
< div id =table_container_right> 
 
< table id =shoppingBasket> 
 
 
 
 
 
 
 
 
 
 
 
 
 
< input name ='selectAll'type ='button'value ='全选'onclick =itemSelected（）;/> 
 
< input name ='clearAll'type ='button'value ='全部清除'onclick =/> 
 
< input name ='removeItem（s）'type ='button'value ='Remove Item（s）'/> 
 
< input name ='sortItemCode'type ='button'value ='按商品代码排序'disabled ='disabled'/> 
 
< input name ='sortPrice'type ='button'value ='按价格排序'disabled ='disabled'/> 
 
< / tbody> 
 
< / table> 
 
< / div> 
 
 
 
< / div> 
 
 
 
< / form> 
  
 
 
解决方案
您正在使用 i = 0 而不是 var i = 0 ，这将引入一个全局变量。这可能是一个问题，如果你在其他地方编写类似的代码。
 
 
 
如果 -statements不是所有。它们看起来像伪代码。您还将比较 = 而不是 == ，这会导致赋值而不是条件，即使你修正了你的语法。
 
 
 
你没有正确缩进你的代码，这会让你更容易引入新的错误。 b $ b 
这些是我立即注意到的一般问题。当然，这些代码可能会造成一堆错误。 字段可能不是数组，计算机和选中可能不符合字段等的大小
 
 
 
如果您有任何具体问题，请描述一下，我们可能能够解决它。
 
There is something in this javascript or html which is is allowing the checkboxes to be ticked but for not even half a second. (I need the checks to stay there!) I also need the additems function to work 
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";
Check all checkboxes function
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;
    }
}
}
Uncheck all checkboxes function
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;
    }
}
}
add checked items to cart
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;
}
update quantity to 1 when item is checked
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;
}
}
Here's the HTML as requested
    <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>

解决方案
You are using i = 0 rather than var i = 0, which will introduce a global variable. This could be a problem if you're writing similar code elsewhere.

Your if-statements are not statements at all. They look like pseudo-code. You're also comparing with = rather than ==, which will cause an assignment rather than a condition, even if you fix up your syntax.

You are not properly indenting your code, which will make you much more prone to introduce new errors.

These are the general issues I notice immediately. Of course, heaps of things could be wrong with this code. fields might not be an array, computer and selected might not match the size of fields, etc.

If you have any specific problem, please describe that, and we may be able to address it.

                        
这篇关于这个Javascript有什么问题？购物车的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！