Как проверить поля ввода с помощью JQuery?
как сделать проверку ввода в поля Имя, Фамилия, Эл. Почта, пароль?
<!doctype html>
<html>
<head>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.1.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.js">
</script>
<link rel="stylesheet" type="text/css" href="new.css" />
</head>
<body>
<div class="container">
<div><div class="texts"> Name </div> <input type="text" name="Name" class="inp" id="text" /> </div>
<div><div class="texts"> Surname </div> <input type="text" name="Surname" class="inp" id="text1"/></div>
<div><div class="texts"> City </div> <input type="text" name="City"class="inp" id="text2"/></div>
<div><div class="texts"> Email </div> <input type="text" name="Email" class="inp" id="text"/></div>
<div><div class="texts"> Password </div> <input type="password" name="Pass" class="inp"/></div>
<div><div class="texts"> Repeat password </div> <input type="password" name="rpt" class="inp"/></div>
</div>
<div class="submit">
<input type="button" name="button" value="register" class="button"/>
</div>
<script>
$(document).ready(function(){
$('.button').click(function(){
var name =$("#text").val();
if (name=="aaa") {alert('asdasd');}
else { $("#text").css('border', 'red 1px solid');}
});
});
</script>
</body>
</html>
|
<form> <input type="text" name="name" placeholder="Ваше имя" required> <button type="submit">Отправить</button> </form> |
Я про jquery код спрашиваю. Как написать код проверки полей?
|
По документации к плагину jquery.validate должно работать вот так:
<!DOCTYPE html>
<form>
<input type="text" name="name" placeholder="Ваше имя" required>
<button type="submit">Отправить</button>
</form>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.1.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.js">
<script>
$('form').validate();
</script>
Но у меня что-то не работает. |
Цитата:
|
Цитата:
|
:write:
всё работает
<!DOCTYPE html>
<form>
<input type="text" name="name" placeholder="Ваше имя" required>
<button type="submit">Отправить</button>
</form>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.1.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.js"></script>
<script>
$('form').validate();
</script>
|
уже сделал
Спасибо всем
$(document).ready(function(){
$('.button').click(function(){
$('.inp').each(function(){
var text = $('#text').val();
if( /[^a-zA-Z]/.test(text)||text.length<=1){
$('#text').css('background-color','#FF7171');
}
else {
$('#text').css('background-color','#C6FFB3');}
});
$('.inp').each(function(){
var text1 = $('#text1').val();
if( /[^a-zA-Z]/.test(text1)||text1.length<=1){
$('#text1').css('background-color','#FF7171');}
else {
$('#text1').css('background-color','white')}
});
$('.inp').each(function(){
var text2 = $('#text2').val();
if( /[^a-zA-Z]/.test(text2)||text2.length<=1){
$('#text2').css('background-color','#FF7171')}
else {
$('#text2').css('background-color','white')}
});
$('.inp').each(function(){
var text3 = $('#text3').val();
var filter = /^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+\.[a-zA-Z0-9-.]+$/;
if (filter.test(text3)){
$('#text3').css('background-color','white')}
else if(text3.length<=1){
$('#text3').css('background-color','#FF7171')}
else {
$('#text3').css('background-color','#FF7171')}
});
$('.inp').each(function(){
var text5 = $('#text5').val();
var text4 = $('#text4').val();
if (text5.length<=1||text4.length<=1||text5!=text4){
$('#text5').css('background-color','#FF7171')
$('#text4').css('background-color','#FF7171')}
else{
$('#text4').css('background-color','white')
$('#text4').css('background-color','white')}
});
});
});
|
Phoenix13, а нафига тогда jquery.validate подключал :D
Этот плагин позволяет то же самое, но в декларативном стиле, используя атрибуты required, minlength и pattern. Правда как сделать проверку повторного ввода пароля - надо смотреть в документацию. Цитата:
|
Ну Я пока новичок в вебе так что, то что ты называешь "наговнокодил" для меня пока это шедевр. Но это пока)) Не судите строго)
|
| Часовой пояс GMT +3, время: 18:36. |