发表新帖
发表新帖

jQuery detect if textarea is empty

前端 未结
关注
11 850
抹茶落季
抹茶落季 2020-12-25 11:05

I am trying to determine if a textarea is empty if a user deletes what is already pre-populated in the textarea using jQuery.

Anyway to do this?

This is what

相关标签:
11条回答
  • 滥情空心
    2020-12-25 11:27

    Andy E's answer helped me get the correct way to working for me:

    $.each(["input[type=text][value=]", "textarea"], function (index, element) {
if (!$(element).val() || !$(element).text()) {
 $(element).css("background-color", "rgba(255,227,3, 0.2)");
}
});

    This !$(element).val() did not catch an empty textarea for me. but that whole bang (!) thing did work when combined with text.

    0 讨论(0)
  • 隐瞒了意图╮
    2020-12-25 11:38

    You can simply try this and it should work in most cases, feel free to correct me if I am wrong : 

    function hereLies(obj) { 
  if(obj.val() != "") { 
    //Do this here 
  }
}

    Where obj is the object of your textarea. 

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<html>
<body>
<textarea placeholder="Insert text here..." rows="5" cols="12"></textarea>
<button id="checkerx">Check</button>
<p>Value is not null!</p>

<script>
  $("p").hide();
  $("#checkerx").click(function(){
      if($("textarea").val() != ""){
        $("p").show();
      }
      else{
       $("p").replaceWith("<p>Value is null!</p>");
      }
  });

</script>
</body></html>

    0 讨论(0)
  • 爱一瞬间的悲伤
    2020-12-25 11:47

    Here is my working code

    function emptyTextAreaCheck(textarea, submitButtonClass) {
        if(!submitButtonClass)
            submitButtonClass = ".transSubmit";

            if($(textarea).val() == '') {
                $(submitButtonClass).addClass('disabled_button');
                $(submitButtonClass).removeClass('transSubmit');
            }

        $(textarea).live('focus keydown keyup', function(){
            if($(this).val().length == 0) {
                $(submitButtonClass).addClass('disabled_button');
                $(submitButtonClass).removeClass('transSubmit');
            } else {
                $('.disabled_button').addClass('transSubmit').css({
                    'cursor':'pointer'
                }).removeClass('disabled_button');
            }
        });
    }
    0 讨论(0)
  • 遇见更好的自我
    2020-12-25 11:48 
    if (!$.trim($("element").val())) {

}
    0 讨论(0)
  • 醉梦人生
    2020-12-25 11:50

    I know you are long past getting a solution. So, this is for others that come along to see how other people are solving the same common problem-- like me.

    The examples in the question and answers indicates the use of jQuery and I am using the .change listener/handler/whatever to see if my textarea changes. This should take care of manual text changes, automated text changes, etc. to trigger the

    //pseudocode
$(document).ready(function () {
    $('#textarea').change(function () {
        if ($.trim($('#textarea').val()).length < 1) {

            $('#output').html('Someway your box is being reported as empty... sadness.');

        } else {

            $('#output').html('Your users managed to put something in the box!');
            //No guarantee it isn't mindless gibberish, sorry.

        }
    });
});

    Seems to work on all the browsers I use. http://jsfiddle.net/Q3LW6/. Message shows when textarea loses focus.

    Newer, more thorough example: https://jsfiddle.net/BradChesney79/tjj6338a/

    Uses and reports .change(), .blur(), .keydown(), .keyup(), .mousedown(), .mouseup(), .click(), mouseleave(), and .setInterval().

    0 讨论(0)
 看不清?
提交回复
热议问题