Jquery if() statement
- Started
- Last post
- 16 Responses
- noob12345
I am trying to get jquery to chack and see if a class is present, but for whatever reason it always returns true.
To test this I pasted the following into a blank html doc and it still returns true.
/*BEGIN*/
<script type="text/javascript" src="http://www.ilikesoda.us/testing/jquery/jquery-1.3.2.js"></script>
<script>if($("#test-fader div#firstDiv.visible")){
alert("true");
} else{
alert("false");
}</script>
/*END*/
Any suggestions on how to make this evaluate properly?
- bigtrickagain0
.visible isn't a property. try:
if($("#test-fader div#firstDiv").css("display") !== "none" || $("#test-fader div#firstDiv").css("visbility") !== "hidden"){
- bigtrickagain0
sorry, should be 'visibility', not 'visbility'
- noob123450
Sorry if that's confusing. ".visible" is one of my class names.
No matter what I call it still returns true even if I call something that's not in the document. I can tell it to look for $(#thisIsWayHarderThanItShouldBe... and it still returns true.
- gregorywieber0
I think you want to do $('#yourElement').hasClass('visi...
- bigtrickagain0
ohhh i see. do this then:
if($("#test-fader div#firstDiv.visible").length > 0) {
- gregorywieber0
Appears that it ate the code of my first comment. Let's see if this works..
<code> $('#yourElement').hasClass('visi...</code>
- acescence0
it's true because you're always returned a jquery object, even if that object is empty. you have to test it's length as bigtrickagain posted above
- gregorywieber0
Except that jquery has a method called hasClass, which is precisely for testing whether or not a given element has a particular class. This appears to be what noob12345 is trying to do.
- noob123450
bigtrickagain, tried this and it does return false now. However, now it returns everything false-
<script>
if($(".visible").length > 0) {
alert("true");
} else{
alert("false");
}
</script>
</head><body>
<div id="firstDiv" class="visible">
<img src="images/01-helv.jpg" />
</div>
<div>
<img src="images/02-target.jpg" />
</div>
<div>
<img src="images/03-wall.jpg" />
</div>
<div>
<img src="images/04-audi.jpg" />
</div>
<div>
<img src="images/05-bug.jpg" />
</div>
</body>
- noob123450
Tried this
if($('#firstDiv').hasClass('.vis... {
and
if($('#firstDiv').hasClass('.vis... > 0) {but both return false. Your code got cut off above and I tried to wing it, but no luck.
- bigtrickagain0
for your javascript in the head:
$(document).ready(function() {
//put your code here
});your code is being run before the DOM is populated - hence always getting false.
- noob123450
bigtrickagain and gregorywieber, you guys rock!
Both methods work after the DOM is populated.
- noob123450
For anyone who's interested, here's bigtrickagain's method-
<script>
$(document).ready(function() {if($(".visible").length > 0) {
alert("true");
} else{
alert("false");
}});
</script>
</head><body>
<div id="firstDiv" class="visible">
<img src="images/01-helv.jpg" />
</div>
<div>
<img src="images/02-target.jpg" />
</div>
<div>
<img src="images/03-wall.jpg" />
</div>
<div>
<img src="images/04-audi.jpg" />
</div>
<div>
<img src="images/05-bug.jpg" />
</div>
</body>
- noob123450
and gregorywieber's-
<script>
$(document).ready(function() {if($('#firstDiv').hasClass('.vis... {
alert("true");
} else{
alert("false");
}});
</script>
</head><body>
<div id="firstDiv" class="visible">
<img src="images/01-helv.jpg" />
</div>
<div>
<img src="images/02-target.jpg" />
</div>
<div>
<img src="images/03-wall.jpg" />
</div>
<div>
<img src="images/04-audi.jpg" />
</div>
<div>
<img src="images/05-bug.jpg" />
</div>
</body>
- gregorywieber0
No prob. Also, bigtrickagain's point about the document being ready is important. You probably want to as a rule do 99% of your jquery after the DOM is ready.