1

我正在做一个预订火车座位的网站。该表格需要一个价格计算器,以便在客户选择服务时显示总金额、乘客数量等。

为了使总成本的变化更明显,我在 div 上使用了 jq 高亮效果,只是为了获得更多关注。

问题是当滑块滑动时我让它突出显示,所以如果我从 0 传递到 56(火车车厢上的最大座位),突出显示出现 56 次。

希望你能帮忙,或者提出一个更好的主意。

这是代码:

$(document).ready(function(){   
    /**/
    function calculateTotal(){
        //var unitPrice = 2, paperTypes = 2, printedSides = 2;
        var precio_base  = $('#categoria option:selected').val();
        var cant_adultos = $("#adultos").val();

        var cant_ninos = $("#ninos").val();
        var sum = parseInt(cant_adultos) + parseInt(cant_ninos);
        var precio_productos = $("input[name^='servicio']").parseNumber();

        var totalCost = parseInt(precio_base)*parseInt(sum);

        $('#total-box').html("$"+totalCost);
        $('#total-box').effect("highlight", {}, 1000);
    }

    $('#categoria,#adultos,#ninos').change(calculateTotal).highlight();

});

该页面位于http://www.micontrol.cl/~mvargas/wordpress/wp-transatacama/reservas-rapidas/form-reservas.php

4

2 回答 2

2

假设您正在使用 jQuery UI 中的滑块小部件(jQuery UI 似乎包含在您链接到的页面上),您可以绑定到stop事件而不是change. 像这样的东西:

$("#yourSlider").bind("slidestop", calculateTotal).highlight();
于 2011-12-16T22:23:38.060 回答
0

您需要停止在每个幻灯片步骤上触发更改事件。只需在停止事件时触发它。例如:http: //jsbin.com/atolax/2

于 2011-12-16T22:32:56.393 回答