jQuery表单验证和语法

时间:2015-04-09 01:27:04

标签: jquery

我正在尝试计算这个,但它不起作用。我也尝试了调试器,它说我在这一行$("#button").click(function() {

上有语法错误

这是我的完整jQuery代码:

 $(document).ready(function(){
  $("#form").validate({
            rules: {
                'wind': {
                    required: true,
                    positiveNumber:true  
                }
            },
            messages: {
                'wind': {
                    required: "This value is required",
                    positiveNumber:"Positive numbers only please"
                }
            }


$("#button").click(function() {
    var temp = Number($('input[name=temp]').val());
    var wind = Number($('input[name=wind]').val());
    var result = (temp - (1.5 * wind));
    $('#result').text(result + " Degree Celsius");

    });
});

});

HTML

            <form style="text-align:center;font-size:120%;" id="form">
    <label>
        <strong>Temperature</strong>
        <input name="temp" type="text" value="" id="temp">
    </label>
    <label>
        <strong>Wind Speed </strong>
        <input name="wind" type="text" value="" id="wind">
    </label>
    <br>
    <br>
    <button value="Submit" id="button" class="button">Submit</button>
    <br>
    <br>
    <button type="reset" value="Reset" id="button1">Reset</button>
</form>

</div>
<div class="res">
    <div id="result"></div>
</div>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="jquery-1.11.2.js">
</script>
<script type="text/javascript" src="script2.js"></script>

2 个答案:

答案 0 :(得分:0)

小蛋糕,通过JSBeautifier(它只是一个漂亮的格式化工具)传递了你的代码,并向我展示了这一点:

$(document).ready(function() {
     $("#form").validate({
         rules: {
             'wind': {
                 required: true,
                 positiveNumber: true
             }
         },
         messages: {
             'wind': {
                 required: "This value is required",
                 positiveNumber: "Positive numbers only please"
             }
         } 
         // NOTICE NOTICE NOTICE
         $("#button").click(function() {
             var temp = Number($('input[name=temp]').val());
             var wind = Number($('input[name=wind]').val());
             var result = (temp - (1.5 * wind));
             $('#result').text(result + " Degree Celsius");
         });
     }); // this guy should be where it screams notice
 });

下面的示例不应该有语法错误。

$(document).ready(function() {
    $("#form").validate({
        rules: {
            'wind': {
                required: true,
                positiveNumber: true
            }
        },
        messages: {
            'wind': {
                required: "This value is required",
                positiveNumber: "Positive numbers only please"
            }
        }
    });

    $("#button").click(function() {
        var temp = Number($('input[name=temp]').val());
        var wind = Number($('input[name=wind]').val());
        var result = (temp - (1.5 * wind));
        $('#result').text(result + " Degree Celsius");
    });
});

答案 1 :(得分:0)

我认为$("#button")不应该在$("#form").validate()内。把它带到外面 验证功能  但请将其保留在$(document).ready(function()

修改

立即查看您的HTML ...在导入中我看不到jquery.validate.min.js ..它将如何运作?

有关更多见解,请参阅this question