jQuery计算器--执行验证而不是计算器。

Question

我做了一个jQuery计算器，它使用燃油量和燃烧速率给时间直到空显示在我的屏幕上。我也在使用表单验证。

当我点击计算器按钮时，它会为一些人运行表单验证，并尝试运行服务器端代码，如果我单击表单提交按钮(该按钮执行它应该以的方式)，这是很好的。但我的计算器按钮"id“属性和"name”属性与表单提交按钮不同。所以我不明白为什么当我点击计算器按钮时，它会尝试运行表单验证。另外，它并没有给出

$('#time-empty-field').val(time_empty);

字段。理想情况下，我希望计算器在$(‘time-空字段’)中显示总数，而不是运行表单验证。

我知道我的HTML很好，从我所能看到的来看，我没有发现我的jQuery有什么问题。也许一双不同的眼睛能帮上忙。任何帮助都将不胜感激。谢谢!

$(function() {
    $('#id').focus();
    // To clear phone example when active
    $('#phone').focus(function() {
          var field = $(this);
          if (field.val() == field.prop('defaultValue')) {
            field.val('').css('color', 'black');
          }
    });
    // Reveals System Report
    $('#system-box input').click(function() {
        if ($(this).attr('checked')) {
            $('#system-report').slideDown('fast');
        } else {
            $('#system-report').slideUp('fast');
        }
    });
    //Calculator
    $('#calculator-submit-btn').submit(function() {
        var fuel_amount = $('#fuel-amount-field').val();
        var burn_rate = $('#burn-rate-field').val();
        var time_empty = fuel_amount * burn_rate;
        time_empty = time_empty.toFixed(2);
        $('#time-empty-field').val(time_empty);
    });
    // Form validation plug-In
    $('#form1').validate({
        rules: {
             id: {
                required: true,
                number: true
             },
             password: {
                required: true
             },
             phone: {
                required: true,
                phoneUS: true
             }
        }, 
        messages: {
          id: {
            required: "Please enter ID number."
          },
          password: {
            required: "Please enter password."
          },
          phone: {
            phoneUS: "Please enter a valid phone number."
          }

        }
    });
}); 

Answer 1

$('#calculator-submit-btn').click(function() {
        var fuel_amount = $('#fuel-amount-field').val();
        var burn_rate = $('#burn-rate-field').val();
        var time_empty = fuel_amount * burn_rate;
        time_empty = time_empty.toFixed(2);
        $('#time-empty-field').val(time_empty);
    });

submit()只能用于提交表单。

有关详细信息，请参阅chec jQuery API：http://api.jquery.com/submit/

简单地说，您不能将submit()事件附加到按钮，而只能附加到窗体。