0

我有一个通过 jQuery ajax 计算价格的脚本,我在 Firebug 控制台中注意到同一个 ajax GET 调用正在发生多次(有时是几十次)。我混合使用 javascript 和 jQuery 来启动该功能,我觉得这就是问题所在。我只是不知道更有效的方法来做到这一点。

当从菜单中选择一个值时,该函数运行。这是代码:

<div id="order_promo">
<select name="promo1" id="promo1" onmouseover="CalcPromo(1)">
<option value="1">Name1</option
.....
.....
</select>
</div>

这是 javascript/jQuery 函数:

function CalcPromo(row){
      $(function(){
         $('#promo' + row).change(function(){
                //values to pass to php script for calculations

                var promo=$(this).val();
                var id=$('#item' + row).val();
                var qty=$('#qty' + row).val();
                var price=$('#price' + row).val();

                var dataString = 'prodid='+ id + '&qty=' + qty + '&price=' + price + '&promo=' + promo + '&type=promo' + '&row=' + row ; //string passed to url
                $.ajax
                ({
                    url: "includes/ajax/orders2.php", //url of php script
                    dataType: 'json', //json is return type from php script
                    data: dataString, //dataString is the string passed to the url
                    success: function(pricedata) //pricedata is the name of json array that is returned
                    {
                        //individual values from json array
                        var listprice = pricedata["price"];
                        var disc = pricedata["disc"];
                        var total = pricedata["total"];
                        var tax = pricedata["tax"];
                        var grand = pricedata["grand"];

                        //set each value using text box id value using javascript val() function
                        $('#price' + row).val(listprice);
                        $('#discprice' + row).val(disc);
                        $('#itemprice' + row).val(total);
                        $("#tax").val(tax);
                        $("#grandtotal").val(grand);
                     },
                     error: function(request, status, error)
                     {
                         alert(request.responseText);
                     }
            });

        });

    });
    }

当从菜单“promo1”中选择一个值时,该功能应该启动。这是我让它发挥作用的唯一方法。我假设他们是一种纯粹的 jQuery 方式来执行此操作并消除多个调用。这就是我挣扎的地方。

谢谢!

4

1 回答 1

2

每次你做一个鼠标悬停(从你的标记)它都会添加一个新的处理程序:

function CalcPromo(row){ 
    $(function(){
        $('#promo' + row).change(function(){

应该是这样的:

$(function(){
     $('select[id^="promo"]').change(function(){

您将需要获得一个“行” - 可能是选择的索引和索引?没有您的标记来评估:

var row = $(this).index('select');

从标记中删除行为:

<select name="promo1" id="promo1" onmouseover="CalcPromo(1)">

变成

<select name="promo1" id="promo1">

替代方法是将一个类添加到标记中,或者更好地添加一个数据元素:

<select name="promo1" id="promo1" class="myselectorclass" data-row="1">

THEN 行成为其中之一:

var row = $(this).data("row");// use this one
// OR
var row = $(this).index('.myselectorclass');

您的活动可能是:

$('.myselectorclass').change(function(){
于 2013-04-09T20:32:43.643 回答