jQuery detecteert of tekstgebied leeg is

Ik probeer te bepalen of een tekstgebied leeg is als een gebruiker verwijdert wat al vooraf in het tekstgebied is ingevuld met jQuery.

Hoe dan ook om dit te doen?

Dit is wat ik heb en het werkt niet

$(textarea).live('change', function(){
            if($(this).val().length == 0) {
                $(submitButtonClass).addClass('disabled_button');
                $(submitButtonClass).removeClass('transSubmit');
            } else {
                $('.disabled_button').addClass('transSubmit').css({
                    'cursor':'pointer'
                }).removeClass('disabled_button');
            }
        });

Antwoord 1, autoriteit 100%

if (!$("#myTextArea").val()) {
    // textarea is empty
}

U kunt ook $.trimgebruiken om ervoor te zorgen dat het element niet bevatten alleen witruimte:

if (!$.trim($("#myTextArea").val())) {
    // textarea is empty or contains only white-space
}

Antwoord 2, autoriteit 10%

if (!$.trim($("element").val())) {
}

Antwoord 3, autoriteit 5%

Ik weet dat je al lang geen oplossing meer hebt. Dit is dus voor anderen die langskomen om te zien hoe andere mensen hetzelfde veelvoorkomende probleem oplossen, zoals ik.

De voorbeelden in de vraag en antwoorden geven het gebruik van jQuery aan en ik gebruik de .change listener/handler/whatever om te zien of mijn tekstgebied verandert. Dit zou moeten zorgen voor handmatige tekstwijzigingen, geautomatiseerde tekstwijzigingen, enz. om de

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

Het lijkt te werken in alle browsers die ik gebruik. http://jsfiddle.net/Q3LW6/. Bericht wordt weergegeven wanneer het tekstgebied de focus verliest.

Nieuwer, uitgebreider voorbeeld:https://jsfiddle.net/BradChesney79 /tjj6338a/

Gebruikt en rapporteert .change(), .blur(), .keydown(), .keyup(), .mousedown(), .mouseup(), .click(), mouseleave() en .setInterval() .


Antwoord 4, autoriteit 4%

Je hoeft alleen maar de waarde van de texbox te krijgen en te kijken of er iets in staat:

if (!$(`#textareaid`).val().length)
{
     //do stuff
}

Antwoord 5, autoriteit 3%

Om erachter te komen of het tekstgebied leeg is, kijken we naar de tekstinhoud van het tekstgebied en als er één enkel teken te vinden is, is dit niet leeg.

Probeer:

if ($(#textareaid).get(0).textContent.length == 0){
  // action
}
//or
if (document.getElmentById(textareaid).textContent.length == 0){
  // action
}

$(#textareaid)geeft ons het jQuery-object textarea.
$(#textareaid).get(0)geeft ons de dom-node.
We kunnen ook document.getElmentById(textareaid)gebruiken zonder jQuery.
.textContentgeeft ons de textContent van dat dom-element.
Met .lengthkunnen we zien of er tekens aanwezig zijn.
Het tekstgebied is dus leeg voor het geval er geen tekens in staan.


Antwoord 6

Hier is mijn werkende 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');
            }
        });
    }

Antwoord 7

if(!$('element').val()) {
   // code
}

Antwoord 8

Hiermee wordt gecontroleerd op leeg tekstgebied en niet alleen spaties in tekstgebied, want dat ziet er ook leeg uit.

var txt_msg = $("textarea").val();
 if (txt_msg.replace(/^\s+|\s+$/g, "").length == 0 || txt_msg=="") {
    return false;
  }

Antwoord 9

Andy E’s antwoord heeft me geholpen de juiste manier van werken voor mij te vinden:

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

Deze !$(element).val()vond geen leeg tekstgebied voor mij. maar dat hele knal (!) ding werkte wel in combinatie met tekst.


Antwoord 10

$.each(["input[type=text][value=]", "textarea[value=]"], function (index, element) {
              //only empty input and textarea will come here
});

Antwoord 11

Je kunt dit gewoon proberen en het zou in de meeste gevallen moeten werken, corrigeer me gerust als ik het mis heb:

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

Waarbij objhet object is van je 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>

Other episodes