2016-12-27 3 views
1

У меня есть 3 textareas с кнопкой отправки, которую я хотел бы включить, только если в каждом из 3-х текстовых областей есть контент. Вот то, что я до сих пор:Как проверить, нет ли текстового поля?

https://jsfiddle.net/2wkb9wmq/5/

HTML

<body> 
    <form> 
    <p>First</p> 
    <textarea name="first" id="first" cols="12" rows="2"></textarea> 
    <p>Second</p> 
    <textarea name="second" id="second" cols="12" rows="2"></textarea> 
    <p>Third</p> 
    <textarea name="third" id="third" cols="12" rows="2"></textarea> 
    <button type='button' disabled>Submit</button> 
    </form> 
</body> 

Jquery

$(document).ready(function() { 
    $('input[type="button"]').attr('disabled', true); 
    $('textarea').on('keyup',function() { 

     $("textarea").each(function() { 

     if ($(this).val() != "") { 

      $('input[type="button"]').attr('disabled', false); 

     } else { 

      $('input[type="button"]').attr('disabled' , true); 
     } 
     });  
    }); 
    }); 

ответ

1

Вы должны использовать переменную и установить его, если один текстовое поле не заполнено:

$(document).ready(function() { 

    var button = $('button'); 
    var textareas = $('textarea'); 

    textareas.on("keyup", function() { 
    var disabled = false; 
    textareas.each(function() { 
     if (!$.trim($(this).val())) { 
     disabled = true; 
     } 
    }); 
    button.attr('disabled', disabled); 
    });  

}); 

Кроме того, я бы использовал !$.trim($(this).val()), чтобы проверить, нет ли текстового поля. Это также запрещает пустые строки. Если пустые строки разрешены, отметьте только !$(this).val().

Ваш обновленный jsfilddle находится здесь: https://jsfiddle.net/2wkb9wmq/8/

Смежные вопросы