javascript - JQuery: check if all <DIV> or <Span> contains a specific text -


i generate few boxes @ runtime, want confirm if boxes contains text "empty", user should not able proceed. if single box contains correct value of box (instead of empty), user should able proceed.

please find me code below:

html

<div>     <div class="bin-area empty floatleft" style="width:242px; height:130px; ">         <label for="9">             <div class="bin" data-binid="0" data-cols="0" data-rows="0">                 <div class="number">s9</div>                 <input class="floatleft styled" id="9" name="checkbox9" type="checkbox" />                 <label for="9"><span class="floatleft marginleft40">empty</span>                  </label>                 <div class="type"></div>                 <div class="description">storage</div>             </div>         </label>     </div>     <div class="bin-area empty floatleft" style="width:242px; height:130px; ">         <label for="9">             <div class="bin" data-binid="0" data-cols="0" data-rows="0">                 <div class="number">s9</div>                 <input class="floatleft styled" id="9" name="checkbox9" type="checkbox" />                 <label for="9"><span class="floatleft marginleft40">empty</span>                  </label>                 <div class="type"></div>                 <div class="description">storage</div>             </div>         </label>     </div>     <div class="bin-area" style=" width:242px; height:130px; ">         <label for="8">             <div class="bin" data-binid="5" data-cols="9" data-rows="5">                 <div class="number">s8</div>                 <input class="floatleft styled" id="8" name="checkbox8" type="checkbox" />                 <div class="type">9x5 storage bin</div>                 <div class="description">est. capacity: 121 pkgs</div>             </div>         </label>     </div> </div> <div style="clear:both"></div> <div role="button" style="margin-top:20px">     <input type="button" id="stepautomap" value="automap" class="active" />     <input type="button" id="stepautomapback" value="back" class="active marginleft50" />     <input type="button" id="stepautomapconfirm" value="confirm &amp; proceed" class="marginleft10" /> </div> 

this html structure... searching of existing posts, tried creating if logic using jquery :

i tried option:

$(document).ready(function () {     $('.bin-area').each(function () {         if ($(this).text() == 'empty') {             alert("empty");         }     }); }); 

and option:

$(document).ready(function () {     if ($("span.floatleft").contains("empty")) {         alert("empty");     } }); 

but nothing worked!

i have created fiddle refer or try!

please refer fiddle: http://jsfiddle.net/aasthatuteja/xjtav/

let me know if need other info.

please suggest!

if want if @ least 1 box contains other "empty", don't need each function. this:

if ($('.bin-area').length === $('.bin-area:contains("empty")').length) {     alert("do nothing"); } else {     alert("do something"); } 

Comments

Popular posts from this blog

c++ - CryptStringToBinary API behavior -

c++ - Correct method for redrawing a layered window -

java.util.scanner - How to read and add only numbers to array from a text file -