How to check if .img is present in jquery

Question

I have the following code:

<div class="field field-name-field-new-photo field-type-image field-label-above">
  <div class="field-label">New Photo:&nbsp;</div>
  <div class="field-items">
    <div class="field-item even">
      <img typeof="foaf:Image" src="some-image-here.jpg" width="500" height="300" alt="" />
    </div>
  </div>
</div>

I would like to check if an image is present because if it is, then I want to disable a different image elsewhere on the page.

I have tried the following but it is not working:

if ( $(".field-name-field-new-photo").length ) {
$(".field-name-field-fallback-photo").hide;
}

Any pointers as to what I am doing painfully wrong would be appreciated.

Check http://stackoverflow.com/questions/3381663/check-if-image-exists-with-given-url-using-jquery if your div markup is on the page all the time then `if ( $(".field-name-field-new-photo").length )` will always return true — Huangism, Jul 01 '15 at 11:57
Can you define what you mean by present? As in if the image tag is on the page or if the image has loaded or not? — Huangism, Jul 01 '15 at 12:05
What I want to check is if div class .field-name-field-new-photo html is in the page then I want to set .field-name-field-fallback-photo to display:none; for example. — BrokenCode, Jul 01 '15 at 12:07
@ghoti the first comment has your answer, `.hide()` is what you needed, the code you used to check if the div is present is fine. Is the missing brackets just a typo? Please also update the question to clarify what you wanted — Huangism, Jul 01 '15 at 12:11
Thank you to all for the feedback and suggestions. I have discovered that in fact jquery is not firing on my page. I have to investigate that first and will then post back with results :) — BrokenCode, Jul 01 '15 at 16:09

CdB · Accepted Answer · 2015-07-01T12:11:34.400

1

Try
$(".field-name-field-fallback-photo").hide();

Edit:
For your provided code, you could check with something like this:

if ($('.field-name-field-new-photo img').length) {
    $(".field-name-field-fallback-photo").hide();
}

Edit 2:
After your last comment, if you just want to check about the .field-name-field-new-photo div:

if ($('.field-name-field-new-photo').length) {
    $(".field-name-field-fallback-photo").hide();
}

edited Jul 01 '15 at 12:11

answered Jul 01 '15 at 11:56

CdB

4,738
7
46
69

@NullPoiиteя The OP says "check if an image is present", which in my understanding means if an img tag is present. If the question is about if an image exists in the url pointed by the src - then obviously this is not the answer. But it's not that clear to me :) – CdB Jul 01 '15 at 12:07
@NullPoiиteя see the OP's last comment... I think this is the point ;) – CdB Jul 01 '15 at 12:09
OP dont even understand basic jquery .. what to say now ... removing my comment – NullPoiиteя Jul 01 '15 at 12:11
Thanks very much @CrisDeBlonde that was it, working now. – BrokenCode Jul 02 '15 at 06:26

score 1 · Answer 2 · answered Jul 01 '15 at 11:59

1

You can utilize .error() callback to determine if the image is loaded in img tag.

$("#IMG_ID").error(function() { 
   // perform required operations
});

answered Jul 01 '15 at 11:59

Pramod Karandikar

5,289
7
43
68

How to check if .img is present in jquery

2 Answers2