jQuery验证程序不起作用

问题描述：

我已将jQuery validate包含在我的网站上以上传广告文件. 我不知道为什么，但这不起作用.

I have included jQuery validate for my site for uploading advertisement file.. I don't know why but this is not working.

HTML文件如下:

<form  enctype="multipart/form-data" action="upload_data.jsp"  id="formToPushAd" method="post">
    <table>
        <tr>
            <td width="100px">Ad Image:</td>
            <td><input type="file" name="file"/></td>
        </tr>  
        <tr>
            <td width="100px">Ad URL:</td>
            <td><input type="text" name="adUrl"/></td>
        </tr>  
        <tr>
            <td>Starting Date:</td>
            <td><input type="text" id="datepicker1" name="datepicker1" /></td>
        </tr>       
        <tr>
            <td>Ending Date:</td>
            <td><input type="text" id="datepicker2" name="datepicker2" onchange="dateSelected()"/></td>
        </tr>
        <tr>
            <td><input type="submit"/></td>

在此脚本之前添加了jQuery验证脚本

jQuery validate script is added before this script

而js文件是:

$().ready(function(){
    $("#formToPushAd").validate({
        rules:{
            file:{
                required:true
            },
            adUrl:{
                required:true,
                url:true
            },
            datepicker1:{
                required:true,
                date:true
            },
            datepicker2:{
                required:true,
                date:true,
            }
        },
        messages:{      
            file:{
                required:"Please Select a frequency"
            },
            adUrl:{
                required:"Please enter ad url"
            },
            datepicker1:{
                required:"Please Enter a date",
                date:"Please Enter a valid date"    
            },
            datepicker2:{
                required:"Please Enter a date",
                date:"Please Enter a valid date"
            }
        }

    })
});

出什么问题了?

答

我认为您不包含jQuery和validate库，因为将它们添加到标头中时工作正常

I think you don't included jQuery and validate libraries because it works fine when you add them in your header

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.8.1/jquery.validate.min.js"></script>

$().ready(function(){
$("#formToPushAd").validate({
    rules:{
        file:{
            required:true
        },
        adUrl:{
            required:true,
            url:true
        },
        datepicker1:{
            required:true,
            date:true
        },
        datepicker2:{
            required:true,
            date:true,
        }
    },
    messages:{      
        file:{
            required:"Please Select a frequency"
        },
        adUrl:{
            required:"Please enter ad url"
        },
        datepicker1:{
            required:"Please Enter a date",
            date:"Please Enter a valid date"    
        },
        datepicker2:{
            required:"Please Enter a date",
            date:"Please Enter a valid date"
        }
    }

})
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.8.1/jquery.validate.min.js"></script>
<form enctype="multipart/form-data" action="upload_data.jsp" id="formToPushAd" method="post">
  <table>
    <tr>
      <td width="100px">Ad Image:</td>
      <td>
        <input type="file" name="file" />
      </td>
    </tr>
    <tr>
      <td width="100px">Ad URL:</td>
      <td>
        <input type="text" name="adUrl" />
      </td>
    </tr>
    <tr>
      <td>Starting Date:</td>
      <td>
        <input type="text" id="datepicker1" name="datepicker1" />
      </td>
    </tr>
    <tr>
      <td>Ending Date:</td>
      <td>
        <input type="text" id="datepicker2" name="datepicker2" onchange="dateSelected()" />
      </td>
    </tr>

    <tr>
      <td>
        <input type="submit" />
      </td>
    </tr>

</form>

jQuery验证程序不起作用

相关推荐