Question

使用the help of members from this post，我从原型转换为jQuery。

function jsUpdateCart(){
  var parameter_string = '';
  allNodes = document.getElementsByClassName("process");
  for(i = 0; i < allNodes.length; i++) {
    var tempid = allNodes[i].id;
    var temp = new Array;
    temp = tempid.split("_");
    var real_id = temp[2];
    var real_value = allNodes[i].value;
    parameter_string += real_id +':'+real_value+',';
  }

  var params = 'ids='+parameter_string;

   $.ajax({
   type: "POST",
   url: "http://127.0.0.1/codeigniter_shopping/index.php/welcome/ajax_cart",
   data: params,
   success: function( r ) {
    $('#ajax_msg').html( r );
    location.reload( true );
  }
 });

}



function jsRemoveProduct(id){
  var params = 'id='+id;
  $.ajax({
   type: "POST",
   url: "http://127.0.0.1/codeigniter_shopping/index.php/welcome/ajax_cart_remove",
   data: params,
   success: function( r ) {
    $('#ajax_msg').html( r );
    location.reload( true );
  }
 });
}

ajax_cart_remove适用于Firefox和IE，但更新适用于Firefox，但不适用于IE 7/8。

请有人给我一些建议。

您可以看到原始的prototype code here。

控制器中的ajax_cart和ajax_cart_remove如下。

function ajax_cart(){
    $this->MOrders->updateCartAjax($this->input->post('ids'));  
  }

  function ajax_cart_remove(){
    $this->MOrders->removeLineItem($this->input->post('id'));
  }

MOders的模型正在跟随。

function removeLineItem($id){
    $id = id_clean($id);
    $totalprice = 0;
    $cart = $_SESSION['cart'];
    if (isset($cart[$id])){
        unset($cart[$id]);
        foreach ($cart as $id => $product){
            $totalprice += $product['price'] * $product['count'];
        }       
        $_SESSION['totalprice'] = $this->format_currency($totalprice);
        $_SESSION['cart'] = $cart;

        echo "Product removed.";
    }else{
        echo "Product not in cart!";
    }
}

function updateCartAjax($idlist){
    $cart = $_SESSION['cart'];
    $records = explode(',',$idlist);
    $updated = 0;
    $totalprice = $_SESSION['totalprice'];

    if (count($records)){
        foreach ($records as $record){
            if (strlen($record)){
                $fields = explode(":",$record);
                $id = id_clean($fields[0]);
                $ct = $fields[1];

                if ($ct > 0 && $ct != $cart[$id]['count']){
                    $cart[$id]['count'] = $ct;
                    $updated++;
                }elseif ($ct == 0){
                    unset($cart[$id]);
                    $updated++;
                }
            }   
        }

        if ($updated){
            $totalprice=0;
            foreach ($cart as $id => $product){
                $totalprice += $product['price'] * $product['count'];
            }       

            $_SESSION['totalprice'] = $this->format_currency($totalprice);
            $_SESSION['cart'] = $cart;

            switch ($updated){
                case 0:
                $string = "No records";
                break;

                case 1:
                $string = "$updated record";
                break;

                default:
                $string = "$updated records";
                break;
            }
            echo "$string updated";

        }else{
            echo "No changes detected";

        }
    }else{
        echo "Nothing to update";

    }
}

以下是表格

的html输出

<form action="http://127.0.0.1/codeigniter_shopping_copy2/index.php/welcome/checkout" method="post"><table border='1' cellspacing='0' cellpadding='5'>
<tr valign='top'>
<td><input type="text" name="li_id[10]" value="1" id="li_id_10" class="process" size="5"  /></td>
<td id='li_name_10'>Dress 1</td>
<td id='li_price_10'>33.95</td>
<td id='li_total_10'>33.95</td>
<td><input type='button' name='delete' value='delete' onclick='jsRemoveProduct(10)'></td>
</tr>
<tr valign='top'>

<td><input type="text" name="li_id[6]" value="2" id="li_id_6" class="process" size="5"  /></td>
<td id='li_name_6'>Shoes 1</td>
<td id='li_price_6'>23.95</td>
<td id='li_total_6'>47.90</td>
<td><input type='button' name='delete' value='delete' onclick='jsRemoveProduct(6)'></td>
</tr>
<tr valign='top'>
<td colspan='3'>&nbsp;</td>
<td colspan='2'>81.85 
<input type="hidden" name="name" value="total" />
<input type="hidden" name="id" value="total" />
<input type="hidden" name="value" value="81.85" />
</td>
</tr>

<tr valign='top'>
<td colspan='3'>&nbsp;</td>
<td colspan='2'><input type='button' name='update' value='update' onclick='jsUpdateCart()'/></td>
</tr>
<tr valign='top'>
<td colspan='3'>&nbsp;</td>
<td colspan='2'><input type="submit" name="submit" value="checkout"  /></td>
</tr>
</table>
</form>

Answer 1

我认为IE不支持document.getElementsByClassName（“”）

尝试替换

allNodes = document.getElementsByClassName("process");

与

allNodes = $(".process");

这是JQuery方式。

Answer 2

在IE8中，只需启动Web Developer Toolkit并在此行中设置一个断点：

$('#ajax_msg').html( r );

我还会在.ajax来电时提出一个断点：

var params = 'ids='+parameter_string;

   $.ajax({

然后看看会发生什么。

通过这种方式，您可以确保正确使用它，否则IE在您到达此处之前可能会遇到问题，或者，如果您到达此处，则需要查看它是否已发送到服务并返回，这是什么第一个网址会告诉你。然后单步执行success代码，看看是否由于错误而在某个时刻跳出来。

一旦你知道这个代码是问题的事实，那么你可以用你学到的东西进行更新，但是我已经在IE7和8中使用了这个功能，所以它应该可以正常工作。

jQuery更新不适用于IE7 / 8

2 个答案: