1

我用 jquery 做了一个非常基本的输入字段计算器,它计算特定的 html 输入字段并将总和打印到下面的输入中。

当调用 jquery 事件:keyup、change 等时,它的工作方式与预期的一样。但是,有时我需要从 SESSION 或 POST 变量设置输入字段值

像这样:

echo "<div class='calculate_data' data-amount='". $x[$i] ."'>". $y[$i] ."</div>";
echo "<input class='calculate_input' name='input_".$i."' type='text' value='". @$_POST['input_'.$i]."' />";
echo "<input id='total' type='text' disabled='disabled' />";

然后计算器应该在页面加载时计算这些值。我几乎尝试了所有事件,但脚本不会计算:

$(document).ready(function() {
    $('.calculate_input').bind("click mouseover keyup change focus load on ready", function() {
        var sum = 0;

        //Sum up
        $('.calculate_input').each(function() {
            sum += Number($(this).val() * $(this).prev('.calculate_data').attr('data-amount'));
        }

        //Set the sum of all the previous fields to the #total field    
        $('#total').val(sum);
        if($('#total').val() == "NaN"){
            $('#total').val("-");
        }
    });
});

什么 jQuery 事件方法完成了任务或者我做错了什么?

4

2 回答 2

0

如果您希望在页面加载时发生这种情况.. 显式触发事件。

你可以试试这个

$('.calculate_input').click();

根据我的知识,还准备好任何非事件..

$('.calculate_input').on("click mouseover keyup change focus load ",

使用.on()而不是.bind()附加事件

您的代码应包含在DOM Ready处理程序中

于 2012-12-04T16:34:06.703 回答
0

您不需要使用这么多事件类型。您只需要在页面加载和更改时使用它。jQuery 已经应该在页面加载时运行,所以只需在语句之外触发它。

更新 根据您的 jQuery 更改而更改

 $(document).ready(function() {
    $('.calculate_input').bind("change", function() {
        var sum = 0;

        //Sum up
        $('.calculate_input').each(function() {
            sum += Number($(this).val() * $(this).prev('.calculate_data').attr('data-amount'));
        }

        //Set the sum of all the previous fields to the #total field    
        $('#total').val(sum);
        if($('#total').val() == "NaN"){
            $('#total').val("-");
        }
    });
 $('.calculate_input').trigger('change'); //when the document is ready, trigger the change
});
于 2012-12-04T16:38:21.597 回答