テキストエリアが空であるかどうかを確認するにはどうすればよいですか？

3つのテキストエリアにそれぞれコンテンツがある場合にのみ有効にしたいサブミットボタン付きの3つのテキストエリアがあります。ここは、私がこれまで持っているものです。テキストエリアが空であるかどうかを確認するにはどうすればよいですか？

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); 
     } 
     });  
    }); 
    });

出典

2016-12-27 Dambo

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/

出典

2016-12-27 14:16:19 Sim

テキストエリアが空であるかどうかを確認するにはどうすればよいですか？

答えて

関連する問題