Почему моя кнопка отправки заполняется?

Question

Я хотел бы потребовать заполнения трех полей до включения кнопки отправки. Jquery ниже работает, но кнопка отправки включена, хотя не все три поля заполняются, за исключением выбора выпадающего списка. Пожалуйста, не обращайте внимания на беспорядок, я пытался несколько способов отладить это, но я в недоумении. Как указано, список выбора работает так, как должен. Посмотрите пример jsfiddle.

http://jsfiddle.net/FPtCE/

HTML: --------- Высокий средний низкий

<input class="required" id="id_title" name="title" placeholder="Please enter a title."  type="text" /> 

<textarea class="required" id="id_comment" name="comment" placeholder="Comment is required"> 
</textarea> 

<input id='submit' type="Submit" value="Submit Comment"> 

</form> 

JQuery:

$(document).ready(function() { 
var val1 = false; 
var val2 = false; 
var val3 = false; 

$('input[id="submit"]').attr('disabled','disabled');       
    $('textarea[id="id_comment"]').keyup(function() { 
    if (val2 == false || val3 == false ||  (!$.trim($('textarea[id="id_comment"]').val())) && ($('textarea[id="id_comment"]').val() == '')) { 
     $('input[id="submit"]').attr('disabled','disabled'); 
     val1 = false; 
    alert ("Comment set:"+val1+", Title set: "+val2+", Priority set: "+val3) 
    } 

    else{ 
    $('input[id="submit"]').removeAttr('disabled'); 
    val1 = true; 
    alert ("Comment set:"+val1+", Title set: "+val2+", Priority set: "+val3) 
    } 
}); 

$('input[id="id_title"]').keyup(function() { 
    if (!$.trim($('input[id="id_title"]').val())){ 
    if (val1 == false && val3 == false){ 
    if ($('input[id="id_title"]').val() == ''){ 
     $('input[id="submit"]').attr('disabled','disabled'); 
     val2 = false; 
     alert ("Comment set:"+val1+", Title set: "+val2+", Priority set: "+val3) 
    } 
    } 
    } 
     else if (!$.trim($('input[id="id_title"]').val())){ 
    if (val1 == false && val3 == false){ 
    if($('input[id="id_title"]').val() != '') { 
     $('input[id="submit"]').attr('disabled','disabled'); 
     val2 = true; 
     alert ("Comment set:"+val1+", Title set: "+val2+", Priority set: "+val3) 
    } 
    } 
    } 
    else{ 
    $('input[id="submit"]').removeAttr('disabled'); 
    val2 = true; 
    alert ("Comment set:"+val1+", Title set: "+val2+", Priority set: "+val3) 
    }                      
});                       

$('select[id="id_priority"]').change(function() { 
    if (val1 == false && val2 == false && ($('select[id="id_priority"]').val() == '')) { 
     $('input[id="submit"]').attr('disabled','disabled'); 
     val3 = false; 
     alert ("Comment set:"+val1+", Title set: "+val2+", Priority set: "+val3) 
    } 
    else if (val1 == false && val2 == false && ($('select[id="id_priority"]').val() != '')) { 
     $('input[id="submit"]').attr('disabled','disabled'); 
     val3 = true; 
     alert ("Comment set:"+val1+", Title set: "+val2+", Priority set: "+val3) 
    } 
    else{ 
    $('input[id="submit"]').removeAttr('disabled'); 
    val3 = true; 
    alert ("Comment set:"+val1+", Title set: "+val2+", Priority set: "+val3) 
    } 
}); 

});  

Answer 1

Проверить это, если это то, что вам нужно: -

Fiddle

function checkSubmit() { 

     $('#submit').prop('disabled', !((($('#id_priority').val() !== "") 
     && $('#id_title').val() !== "" 
     && $('#id_comment').val() !== ""))); 
    } 

Простейшее Версия: - Fiddle

$(document).ready(function() { 
    $('#submit').attr('disabled', 'disabled'); 
    $('#id_comment').keyup(checkSubmit); 
    $('#id_title').keyup(checkSubmit); 
    $('#id_priority').change(checkSubmit); 

    function checkSubmit() { 

     $('#submit').prop('disabled', !(($('#id_priority').val() !== "") 
         && $.trim($('#id_title').val()) !== "" 
         && $.trim($('#id_comment').val())!== "")); 
     } 
});