JS怎么实现购物车中删除商品

Question

我在checkbox中选择一个商品后，该商品的 编号和数量 被添加到一个数组中，当我取消选择时要把该商品的编号和数量从数组中移除，怎么来实现呢？？？？<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<ProjectBase.Utils.Entities.PageOfList<Taka.Core.Products.Product>>" %><asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">    <h2>AddOrder</h2>    <% using (Html.BeginForm()) {%>
        <%= Html.ValidationSummary(true) %>
              <div class="editor-label">
                <%= Html.Label("用户名：") %>
                <%=Html.TextBox("UserName", ViewData["UserName"])%>
                <%= Html.Hidden("UserId", ViewData["UserId"])%>
            </div>
          
             <table id="Table_Product" width="780" border="0" cellpadding="0" cellspacing="0" class="m99-table-A">
        <thead class="m99-thead">  
        <tr>
            <th id="PRODUCTSID">
                产品编号
            </th>
            <th>
                产品名称
            </th>
            <th>
                产品价格
            </th>
            <th>选择数量</th>
            <th>
                选择商品
            </th>
        </tr>
        </thead>
        <% foreach (var item in Model)
           { %>
        <tr style =" text-align :left ">
            <td>
                <%= Html.Encode(item.ID) %>
            </td>
            <td>
                <%= Html.Encode(item.ProductName) %>
            </td>
            <td>
                <%= Html.Encode(item .ProductPrice) %>
            </td>  
            <td>
                <%= Html.TextBox("PNum_"+item.ID)%>
            </td>      
            <td>
                 <%= Html.CheckBox("PId_" + item.ID, new { onclick = "GetProductIdNum(this);" })%>
            </td>
        </tr>
        <% } %>
    </table>
    <div class="listHeader-99">
        <% if (Model.RecordTotal == 0)
           { %>
        <div class="Shuom-700">
            暂无相关记录 !
        </div>
        <%}
           else
           { %>
        <div style="float: left; width: 180px;">
            共<span class="f-hei-A">
                <%= Model.RecordTotal%></span> 条,每页显示
            <%= Model.PageSize%>
            条
        </div>
        <%} %>
        <div class="pager" style="float: right;">
            <%= Html.Paging(Model) %>
        </div>    </div> <br /><br /><br />            <div class="editor-label">
                <%= Html.Label("送达地址：") %>
            </div>
            <div class="editor-field">
                <%= Html.TextBox("OrderAddress", ViewData["OrderAddress"])%>
            </div>
            <div class="editor-label">
                <%= Html.Label("订单描述：") %>
            </div>
            <div class="editor-field">
                <%= Html.TextBox("OrderDescription", ViewData["OrderDescription"])%>
            </div>
             <div class="editor-field">
               <%= Html.Hidden("ProductIdNum", ViewData["ProductIdNum"])%>
            </div>
            <br />
            <p>
                 <input type="submit" id="submit1" value="生成订单" />
            </p>
             <div>
        <%= Html.ActionLink("Back", "UserList","User") %>
    </div>
</asp:Content>
 <script src="../../Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        //获取产品编号数量 并生成Result 同时将Result添加到ProductIdNum隐藏域中，在后台获取该隐藏域中的值
        function GetProductIdNum(obj) {
            var Pid = obj.id.substring(4).toString();
            var id = 'PNum_' + Pid;
            var Pnum = window.document.getElementById(id).value;
            var Result = Pid + '_' + Pnum;
            document.getElementById("ProductIdNum").value += Result + ',';}
    </script>

Answer 1

最简单（但最可靠）的办法是，每次点击CHECKBOX时都循环读取勾选了的CHECKBOX

Answer 2

原来就是这么写的，但是有人说用Json,

Answer 3

你可以请那人来做做这个选择题：
现在需要他去杀只鸡，请选择(A)或(B)(A)  一把刀6尺长-----------杀牛用的；
(B)  一把刀3寸长-----------杀鸡用的；

Answer 4

<script type="text/javascript">
        //获取产品编号数量 并生成Result数组 同时将Result添加到ProductIdNum隐藏域中，在后台获取该隐藏域中的值
        function GetProductIdNum(obj) {            var CheckBoxList = window.document.getElementsByTagName("input");
            var Pid;
            for (var i; i < CheckBoxList.length; i++) {
                if (CheckBoxList[i].type == "checkbox") {
                    if (CheckBoxList[i].checked == true) {
                        var Pid = obj.id.substring(4).toString();
                        var id = 'PNum_' + Pid;
                        var Pnum = window.document.getElementById(id).value;
                        var Result = Pid + '_' + Pnum;
                        document.getElementById("ProductIdNum").value += Result + ',';
                        var pics = document.getElementById("ProductIdNum").value+'='; 
                        alert(Pnum);
                        alert(Result);
                        alert(pics);       
                    
                    }
                
                }            }
           
        }这样写可以么

Answer 5

<script type="text/javascript">
        //获取产品编号数量 并生成Result数组 同时将Result添加到ProductIdNum隐藏域中，在后台获取该隐藏域中的值
        function GetProductIdNum(obj) {            var CheckBoxList = window.document.getElementsByTagName("input");
            for (var i; i < CheckBoxList.length; i++) {
                if (CheckBoxList[i].type == "checkbox") {
                    if (CheckBoxList[i].checked == true) {
                        var Pid = obj.id.substring(4).toString();
                        var id = 'PNum_' + Pid;
                        var Pnum = window.document.getElementById(id).value;
                        var Result = Pid + '_' + Pnum;
                        document.getElementById("ProductIdNum").value += Result + ',';
                    }
                
                }            }
           
        }

Answer 6

创建时给每个CHECKBOX都加个name属性不是很容易吗？
例如:name='chkOrder'
function GetProductIdNum(obj) {
  var chkList= document.getElementsByName("chkOrder");
  var arrOrder=[];//购物车商品数组
  for (var i; i < chkList.length; i++) {
    if(chkList[i].checked){ 
      var id = 'PNum_' + obj.id.substring(4).toString();
      var Pnum = document.getElementById(id).value;
      var Result = Pid + '_' + Pnum;
      arrOrder.push(Result );
    }
  }
  document.getElementById("ProductIdNum").value =arrOrder.join(',').toString();
}

Answer 7

多了个空格
arrOrder.push(Result );--------->arrOrder.push(Result);

Answer 8

我的  <%= Html.CheckBox("PId_" + item.ID, new { onclick = "GetProductIdNum(this);" })%>是放在<% foreach (var item in Model){ %>  <% } %>循环中的，name属性怎么添加呢？？？

Answer 9

这要问你呀，哈哈。
你找找Model里是什么内容

Answer 10

感叹一下：
框架、函数、类。搞的太多，连最基本的DOM元素都不知道哪里找去了，呵呵

Answer 11

  function GetProductIdNum(obj) {
            var CheckBoxList = window.document.getElementsByTagName("input");
            var arrOrder=[];//购物车商品数组
            for (var i; i < CheckBoxList.length; i++) {
                if (CheckBoxList[i].type == "checkbox" && CheckBoxList[i].checked) {
                  
                        var Pid = obj.id.substring(4).tostring();
                        var id = 'PNum_' + Pid;
                        var Pnum = window.document.getElementById(id).value;
                        var Result= Pid + '_' + Pnum;
                        arrOrder.push(Result);
                        //document.getElementById("ProductIdNum").value += Result + ',';
                        alert(Result);
                        alert(Pnum);
                    
                  
                }            }
            document.getElementById("ProductIdNum").value = arrOrder.join(',').toString();
            var test = document.getElementById("ProductIdNum").value;
            alert(test);
        }js这样，但隐藏域（test）中没有值，大哥 别笑我，我好着急的

Answer 12

function GetProductIdNum(obj) {
            var CheckBoxList = window.document.getElementsByTagName("input");
            var arrOrder=[];//购物车商品数组
            for (var i=0; i < CheckBoxList.length; i++) {
                if (CheckBoxList[i].type == "checkbox" && CheckBoxList[i].checked) {
                  
                        var Pid = obj.id.substring(4).tostring();
                        var id = 'PNum_' + Pid;
                        var Pnum = window.document.getElementById(id).value;
                        var Result= Pid + '_' + Pnum;
                        alert(Pnum);//这里有值吗？
         
                        alert(Result);//这里有值吗？
           
                        arrOrder.push(Result);
alert(arrOrder)
                        //document.getElementById("ProductIdNum").value += Result + ',';                  
                }            }
            document.getElementById("ProductIdNum").value = arrOrder.join(',').toString();
            var test = document.getElementById("ProductIdNum").value;
            alert(test);
}----------------
1、注意:var i=0;
for (var i=0; i < CheckBoxList.length; i++) {2、改变你的调试顺序，看看有值吗？

Answer 13

没有值，没有走for(){}，直接到了
document.getElementById("ProductIdNum").value = arrOrder.join(',').toString();

Answer 14

function GetProductIdNum(obj) {
  var CheckBoxList = window.document.getElementsByTagName("input");
alert(CheckBoxList)//是什么？undefined？还是object?
//如果不是对象，那....................................
  var arrOrder=[];//购物车商品数组alert(CheckBoxList.length)//是什么？undefined？还是别的?
  for (var i=0; i < CheckBoxList.length; i++) {

Answer 15

 function GetProductIdNum() {
            var CheckBoxList = window.document.getElementsByTagName ("input");
            var Pid;
            var Pnum;
            var Result_ID;
            var Result_Num;
            for (var i=0; i < CheckBoxList.length; i++) {
                if (CheckBoxList[i].type == "checkbox"){
                    if (CheckBoxList[i].checked) {
                        Pid= CheckBoxList[i].value;
                        var id = 'PNum_' + Pid;
                        Pnum = window.document.getElementById(id).value;
                        Result_ID += Pid + ',';
                        Result_Num += Pnum + ',';
                    }
                }            }
            document.getElementById("Product_Id").value = Result_ID;
            document.getElementById("Product_Num").value = Result_Num;
            var id = document.getElementById("Product_Id").value;
            var num = document.getElementById("Product_Num").value;
            alert(id);
            alert(num);
        }
        function save() {
            GetProductIdNum();
        }我写成这样了，但是出现了个错误 我输出隐藏域中的值的时候多出了一个undefined
例如：undefined 89,86
     undefined 1,2

Answer 16

没有给 var Pid = obj.id.substring(4).tostring();
                        var id = 'PNum_' + Pid;
                        var Pnum = window.document.getElementById(id).value;
                        var Result= Pid + '_' + Pnum;中的变量 PID，id，Pnum,Result赋初始值=“”；ＬＺ可以试试哈，成功了，给分哦

Answer 17

  function GetProductIdNum(obj) {            var Pid = obj.id.substring(4).toString();
            var id = 'PNum_' + Pid;
            var Pnum = window.document.getElementById(id).value;
            var Result = Pid + '_' + Pnum + ',';            if (obj.checked == true) {
            
                document.getElementById("ProductIdNum").value += Result;
                var ppp = document.getElementById("ProductIdNum").value;
                //alert(ppp);
            }
            if (obj.checked == false) {
            
                var HiddenAreaValue = document.getElementById("ProductIdNum").value;
                if (HiddenAreaValue.indexOf(Result, 0) > -1) {
                
                    //alert("1");
                    var xxx = HiddenAreaValue.replace(Result,' ');
                    document.getElementById("ProductIdNum").value = xxx;
                    var yyy = document.getElementById("ProductIdNum").value;
                    //alert(yyy);
                    //alert(HiddenAreaValue.replace(Result, ','));
                }
            }
        }我现在写成这样了，问题解决了；
不错出现了一个小问题：当textbox中的值为空的时候，点击checkbox，获取的值的格式为 
Pid + '_' + null + ','；只有当textbox中有值的时候 然后点击checkbox才能获取到正确的值，否则就出现上面描述的那个小问题,js里面还要写东西判断