我出于某种原因无法使用我的脚本验证rep id字段。我花了好几个小时就无法解决这个问题。除了repid之外,所有其他字段都可以正常验证。
以下是我用于表单
的代码 <form action="<?php echo $editFormAction; ?>" method="POST" enctype="multipart/form-data" name="repsignup" id="repsignup">
<h1>Janoo Rep Sign Up</h1>
<p>Join our growing team and help rep Janoo out there in the world!</p>
<p> </p>
<h4>
Name (First and Last):
<input name="name" type="text" required="required" id="name" form="repsignup" placeholder="John Doe" size="70" maxlength="70" />
</h4>
<h4>
<label for="repid">Rep ID:</label>
<input name="repid" type="text" id="repid" form="repsignup" placeholder="DoeJ" size="32" maxlength="15" />
</h4>
<h4>
<label for="email">Email:</label>
<input name="email" type="email" required="required" id="email" form="repsignup" placeholder="Jdoe@gmail.com" size="89" maxlength="100" />
</h4>
<p><strong>* Your default password is "password" all lowercase! Please change it as soon as you log in.</strong></p>
<p> </p>
<p>*As of right now we only have reps in the United States</p>
<h4>
<label for="address">Address:</label>
<input name="address" type="text" required="required" id="address" form="repsignup" placeholder="12345 Street" size="86" />
</h4>
<h4>
<label for="city">City:</label>
<input name="city" type="text" required="required" id="city" form="repsignup" placeholder="Detroit" size="92" />
</h4>
<h4>
<label for="country">State:</label>
<input name="State" type="text" required="required" id="address3" form="repsignup" placeholder="ex. MI" size="90" maxlength="2" />
</h4>
<h4>
<label for="address5">Zipcode:</label>
<input name="zipcode" type="text" required="required" id="address5" form="repsignup" placeholder="48201" size="87" />
</h4>
<h4>
<label for="gender">Gender:</label>
<select name="gender" size="1" id="gender" form="repsignup">
<option value="Null">No Answer</option>
<option value="Male">Male</option>
<option value="Female">Female</option>
</select>
</h4>
<h4>
<label for="birthday">Birthday:</label>
<input name="birthday" type="date" required="required" id="birthday" form="repsignup" />
</h4>
<h4>
<label for="about">About you:<br />
</label>
<textarea name="about" cols="100" rows="10" maxlength="250" id="about" form="repsignup"></textarea>
</h4>
<h4>
<label for="shirtsize">Shirt Size:</label>
<select name="shirtsize" id="shirtsize" form="repsignup">
<option value="as">Adult Small</option>
<option value="am">Adult Medium</option>
<option value="al">Adult Large</option>
<option value="axl">Adult XL</option>
<option value="axxl">Adult XXL</option>
</select>
</h4>
<h4>What team are you appling for? (Select all that apply) </h4>
<p>
<input name="skate" type="checkbox" id="skate" form="repsignup" />
<label for="skate">Skateboard </label>
</p>
<p>
<input name="snow" type="checkbox" id="snow" form="repsignup" />
<label for="snow">Snowboard </label>
</p>
<p>
<input name="longboard" type="checkbox" id="longboard" form="repsignup" />
Longboard
</p>
<p>
<input name="video" type="checkbox" id="video" form="repsignup" />
Video Production
</p>
<p>
<input name="music" type="checkbox" id="music" form="repsignup" />
Music Production
</p>
<p>
<input name="model" type="checkbox" id="model" form="repsignup" />
<label for="model">Modeling </label>
</p>
<p> </p>
<h4>Links to your contacts</h4>
<p>
<label for="instagram">Instagram:</label>
<input name="instagram" type="text" id="instagram" form="repsignup" size="86" maxlength="80" />
</p>
<p>
<label for="facebook">Facebook:</label>
<input name="facebook" type="text" id="facebook" form="repsignup" size="86" maxlength="80" />
</p>
<p>
<label for="twitter">Twitter:</label>
<input name="twitter" type="text" id="twitter" form="repsignup" size="86" maxlength="80" />
</p>
<p>
<label for="youtube">YouTube:</label>
<input name="youtube" type="text" id="youtube" form="repsignup" size="86" maxlength="80" />
</p>
<p>
<label for="website">Website:</label>
<input name="website" type="text" id="website" form="repsignup" size="86" maxlength="80" />
</p>
<p>
<label for="otherlinks">Other:</label>
<input name="otherlinks" type="text" id="otherlinks" form="repsignup" size="86" maxlength="80" />
</p>
<p> </p>
<p><strong>Here is some stuff you should read up on:</strong></p>
<p>Reps are paid out when they hit $5 in commison.</p>
<p>Rep codes do NOT work with coupons.</p>
<p>Default commison is 10% of all your sales but may vary.</p>
<p> </p>
<p><strong>For any of your media content to be used you must agree to the <a href="media terms.php" target="new">the terms and conditions</a></strong></p>
<p>
<input name="media" type="checkbox" disabled="disabled" id="media" form="repsignup" checked="checked" />
I agree to <a href="media terms.php" target="new">the terms and conditions</a> for usage of my media and allow the promotion of me as a individual </p>
<p>
<input name="inform" type="checkbox" id="inform" form="repsignup" checked="checked" />
<label for="inform">Inform me of my sales</label>
as a rep
</p>
<p>
<input name="DATE" type="hidden" id="DATE" value="<?php echo date('Y-m-d'); ?>" />
<input name="com" type="hidden" id="com" form="repsignup" value="10" />
<input name="country" type="hidden" id="country" value="United States of America" />
<input name="password" type="hidden" id="password" form="repsignup" value="861aab8d5bdd93565a7454e5e5754f8f" />
<input name="1" type="hidden" id="1" value="1" />
<input name="discount" type="hidden" id="discount" value="5" />
<input name="2" type="hidden" id="2" value="2" />
<input name="enddate" type="hidden" id="enddate" value="3000-01-01 00:00:00" />
<input name="avail" type="hidden" id="avail" value="30000000" />
</p>
<p>
<?php print imageorsubmit(@$imgsubmit,$GLOBALS['xxSubmt'],'submit')?></p>
<p>
<input type="hidden" name="MM_insert" value="repsignup" />
</p>
</form>
这是我用来验证它的javascript
<script type="text/javascript">
$( document ).ready(function() {
$("#repsignup").submit(function(event){
//alert("The paragraph was clicked.");
var name = $("#name").val();
var repid = $("#repid").val();
var address = $("#address").val();
var city = $("#city").val();
var state = $("#address3").val();
var zipcode = $("#address5").val();
var gender = $("#gender").val();
var birthday = $("#birthday").val();
var about = $("#about").val();
var skate = $("#skate").val();
var snow = $("#snow").val();
var longboard = $("#longboard").val();
var video = $("#video").val();
var music = $("#music").val();
/*Social fields*/
var instagram = $("#instagram").val();
var facebook = $("#facebook").val();
var twitter = $("#twitter").val();
var youtube = $("#youtube").val();
var website = $("#website").val();
var otherlinks = $("#otherlinks").val();
//alert(name.split(" ").length);
var a = isValidCharacter(name);
//alert(a);
/*Name validation*/
if(name.split(" ").length==2 && a)
;
else{
alert('Please enter first and last name separated by a space. No special character is allowed');
event.preventDefault();
}
validRepid = isValidCharacter(repid);
if(repid.indexOf('>') > -1 || repid.indexOf('<') > -1){
alert('Rep ID should not have any special character.');
event.preventDefault();
}
validAddress = isValidCharacter(address);
if(address.indexOf('>') > -1 || address.indexOf('<') > -1){
alert('Address should not have any special character.');
event.preventDefault();
}
validCity = isValidCharacter(city);
if(city.indexOf('>') > -1 || city.indexOf('<') > -1){
alert('City should not have any special character.');
event.preventDefault();
}
validState = isValidCharacter(state);
if(state.indexOf('>') > -1 || state.indexOf('<') > -1){
alert('State should not have any special character.');
event.preventDefault();
}
validZipcode = isValidCharacter(zipcode);
if(zipcode.indexOf('>') > -1 || zipcode.indexOf('<') > -1){
alert('Zipcode should not have any special character.');
event.preventDefault();
}
validGender = isValidCharacter(gender);
if(gender.indexOf('>') > -1 || gender.indexOf('<') > -1){
alert('Gender should not have any special character.');
event.preventDefault();
}
if (birthday.indexOf('>') > -1 || birthday.indexOf('<') > -1)
{
alert('Birthday should not have any special character.');
event.preventDefault();
}
validAbout = isValidCharacter(about);
if(!validAbout){
alert('About field should not have any special character.');
event.preventDefault();
}
var flag = false;
if($("#skate").prop("checked"))
flag = true;
if($("#snow").prop("checked"))
flag = true;
if($("#skate").prop("checked"))
flag = true;
if($("#longboard").prop("checked"))
flag = true;
if($("#video").prop("checked"))
flag = true;
if($("#music").prop("checked"))
flag = true;
if($("#model").prop("checked"))
flag = true;
if(flag==false){
alert('Please select at least one team to apply for.');
event.preventDefault();
}
if(instagram.indexOf('>') > -1 || instagram.indexOf('<') > -1){
alert('Instagram field should not have any special character.');
event.preventDefault();
}
if(facebook.indexOf('>') > -1 || facebook.indexOf('<') > -1){
alert('Facebook field should not have any special character.');
event.preventDefault();
}
if(twitter.indexOf('>') > -1 || twitter.indexOf('<') > -1){
alert('Twitter field should not have any special character.');
event.preventDefault();
}
if(youtube.indexOf('>') > -1 || youtube.indexOf('<') > -1){
alert('Youtube field should not have any special character.');
event.preventDefault();
}
if(website.indexOf('>') > -1 || website.indexOf('<') > -1){
alert('Website field should not have any special character.');
event.preventDefault();
}
if(otherlinks.indexOf('>') > -1 || otherlinks.indexOf('<') > -1){
alert('Otherlinks field should not have any special character.');
event.preventDefault();
}
});
});
function isValidCharacter(str){
return !/[~`#$%\^&*+=\-\[\]\\';,/{}|\\":<>\?]/g.test(str);
}
</script>
答案 0 :(得分:0)
您可以验证所有字段,而无需获取每个单独的值,只使用一个函数:
$(document).ready(function(){
var allFine = true;
function valdiate(){
var value = $(this).val();
if(value !== null && value.trim().length() > 0 && !value.match(/[\<\>]/));
var allFine = false;
$(this).css('border', '1px solid red');
}
// selector for all required input and textarea tags in your html
$('form').find('input:required, textarea:required').each(validate);
$('form').on('submit', function(){
if(!allFine) {
event.preventDefault();
event.stopPropagination();
alert('there is a failure, have a look on the red bordered fields');
}
// otherwise the form is submitted normal
});
})
如果您需要检查所有输入字段以进行验证,请删除选择器中的:required标志,并从if
中删除null和length检查请记住,如果您使用html5,您还可以使用pattern属性来输入带有正则表达式的元素:
<input name="myInput" type="text" pattern="[a-zA-Z0-9 .,-]" required>
或其他一些你想要的正则表达式