Как я могу получить поля ввода для проверки onkeyup?

Question

У меня есть форма, которая проверяет использование ajax. Когда кнопка отправляется, поля ввода выделяют, если они недействительны, и появляется окно предупреждения. Если форма снова отправлена ​​и данные в поля ввода действительны, поле ввода не будет выделено.

Прямо сейчас, я не могу показаться, чтобы получить поле ввода для проверки OnKeyUp, срезанного прошлые и т.д.

Я хотел бы, чтобы <p> тегов в, если заявление для проверки на OnKeyUp и поле ввода для проверки OnKeyUp , Прямо сейчас, я могу сделать это только тогда, когда нажата кнопка отправки.

Что мне не хватает?

http://jsfiddle.net/b6eudmuf/4/

 $(document).ready(function() { 
$('form #response2').hide(); 


$('.button2').click(function(e) { 
$('input[type="text"]').on("keyup bind cut copy paste", function(){ 
}); 

e.preventDefault(); 

var valid = ''; 
var required = ' is required'; 
var first = $('form #first').val(); 
var last = $('form #last').val(); 
var email = $('form #email').val(); 
var tempt = $('form #tempt').val(); 
var tempt2 = $('form #tempt2').val(); 


if(first=='' || first.length<=1) { 
if (/^\s*$/.test(first.value)); 
    $('form #first').css('border','2px solid #ff0000'); 
    $('form #first').css('background-color','#ffcece'); 
    valid += '<p>Your first name is required</p>'; 
} 
else { 
    $('form #first').css('border','1px solid #ffd09d'); 
    $('form #first').css('background-color','#ffffff'); 
} 

if(last=='' || last.length<=1) { 
    $('form #last').css('border','2px solid #ff0000'); 
    $('form #last').css('background-color','#ffcece'); 
    valid += '<p>Your last name' + required + '</p>'; 
} 
else { 
    $('form #last').css('border','1px solid #ffd09d'); 
    $('form #last').css('background-color','#ffffff'); 
} 

if (!email.match(/^([a-z0-9._-]+@[a-z0-9._-]+\.[a-z]{2,4}$)/i)) { 
    valid += '<p>Your e-mail address' + required + '</p>'; 
} 

if (tempt != 'http://') { 
    valid += '<p>We can\'t allow spam bots.</p>'; 
} 

if (tempt2 != '') { 
    valid += '<p>A human user' + required + '</p>'; 
} 

if (valid != '') { 
    $('form #response2').removeClass().addClass('error2') 
     .html('' +valid).fadeIn('fast'); 
} 

else { 
    $('form #response2').removeClass().addClass('processing2').html('<p style="top:0px; left:0px; text-align:center; line-height:1.5em;">Please wait while we process your information...</p>').fadeIn('fast'); 

    var formData = $('form').serialize(); 
    submitFormSubscribe(formData); 
} 

}); 

}); 

function submitFormSubscribe(formData) { 

$.ajax({ 

type: 'POST', 
url: 'http://3elementsreview.com/blog/wp-content/themes/3elements/php-signup/sign-up-complete.php', 
data: formData, 
dataType: 'json', 
cache: false, 
timeout: 4000, 
success: function(data) { 

$('form #response2').removeClass().addClass((data.error === true) ? 'error2' : 'success2') 
      .html(data.msg).fadeIn('fast'); 

if ($('form #response2').hasClass('success2')) { 
setTimeout("$('form #response2').fadeOut('fast')", 6000); 
} 

}, 
error: function(XMLHttpRequest, textStatus, errorThrown) { 

$('form #response2').removeClass().addClass('error2') 
.html('<p>There was an <strong>' + errorThrown + 
'</strong> error due to an <strong>' + textStatus + 
'</strong> condition.</p>').fadeIn('fast'); 
}, 
complete: function(XMLHttpRequest, status) {      
$('form')[0].reset(); 
} 
}); 
}; 

Answer 1

Похоже Liks вы обязывающие пустой обработчик KeyUp событий внутри события нажатия элементов с CSS классом 'Button2':

$('.button2').click(function (e) { 
     $('input[type="text"]').on("keyup bind cut copy paste", function() {}); 

что вы хотите:

$("document").ready(function(){ 
    $('input[type="text"]').on("keyup bind cut copy paste", function() { 
     //Put your validation logic here - this is the code that will fire on each keyup 
    }); 
});