相同的Jquery Validation Plugin实现不在两个页面上工作

时间:2018-05-02 00:56:33

标签: jquery html validation plugins

我有两个HTML页面都有相同的代码。我使用了jquery验证插件来验证所需的仅数字字段。第一页正在工作,而第二页则没有。我哪里错了。

工作代码

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <title></title>
    <link href="bootstrap.css" rel="stylesheet"></link>
    <link href="app.css" rel="stylesheet"></link>   
    <script type="text/javascript" src="jquery-1.11.1.js"></script> 
    <script type="text/javascript" src="jquery.validate.js"></script>   
<script type="text/javascript">
$(document).ready(function() {  
$("#abc").validate({
      rules: {
          price: {
          required: true,
          number: true        
        }
      },
      messages: {
          price : "enter Numeric value"  
      }
    }); 
});
</script>   
</head>
<body>
    <div class="generic-container">

        <form id="abc" name="abc" action="" method="POST">
            <div class="form-group col-md-6">
                    <label class="col-md-4 control-lable" for="price"> Price </label>
                    <div class="col-md-7">                  
                        <input  name="price" id="price" type="text" />                      

                    </div>
                </div>
            <input type="submit" value="Submit" class="btn btn-primary btn-sm"/>            
        </form>
    </div>
</body>
</html>

非工作守则如下:

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
            <title></title>
            <link href="bootstrap.css" rel="stylesheet"/>
            <link href="app.css" rel="stylesheet"/> 
            <script type="text/javascript" src="jquery-1.11.1.js"/> 
            <script type="text/javascript" src="jquery.validate.js"/>   
            <script type="text/javascript">
$(document).ready(function() {  
$("#abc").validate({
      rules: {
          price: {
          required: true,
          number: true        
        }
      },
      messages: {
          price : "enter numeric value"  
      }
    });
});
</script>       
        </head>
        <body>
            <div class="generic-container">

                <form id="abc" name="abc" action="" method="POST" >     
                    <div class="form-group col-md-6">
                        <label class="col-md-4 control-lable" for="price">Price </label>
                        <div class="col-md-7">                      
                            <input name="price" id="price"  type="text"   />                    
                        </div>
                    </div>
                    <input type="submit" value="Save" class="btn btn-primary btn-sm"/>
                </form>
            </div>
        </body>
    </html>

我比较了代码,但除了白色空格之外无法找到任何区别。

1 个答案:

答案 0 :(得分:2)

您没有正确关闭脚本标记。使用<script></script>代替<script />