img src not changed in jQuery script in Firefox and IE

Question

I have img

 <img src="captcha.jpg" id="my-image"/>

and jQuery script for change captcha image

<script>
    $(document).ready($("#my-image").click(function(){
        $('#my-image').attr('src', "captcha.jpg");
                        alert('adfgf');
    }));
</script>

when i click to image triggered image change and call alert in chrome. But in Firefox and in IE alert is called but image not changed. How fix it?

EDIT

@RequestMapping(value = "/captcha.jpg", method = RequestMethod.GET)
    public void captcha(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        super.captcha(req, resp);
    }

You're changing the image src from `captcha.jpg` to `captcha.jpg` (which normally does nothing), is it normal ? — Aurel, Apr 22 '16 at 10:07

score 2 · Answer 1 · edited May 23 '17 at 10:33

You made an error using the ready handler, you need to pass it a function.

Here's what you should do instead :

$(document).ready(function() {
    $("#my-image").click(function(){
        $('#my-image').attr('src', "captcha.jpg");
        alert('adfgf');
    });
});

EDIT : I included a snippet with an example to show you that it works.

$(document).ready(function() {
    $("#my-image").click(function(){
        $('#my-image').attr('src', "//placehold.it/100x100");
        alert('adfgf');
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src="//placehold.it/50x50" id="my-image"/>

EDIT n°2 : And if you just want to reload/refresh your image, you can use :

$('#my-image').attr('src', "captcha.jpg" + Math.random())

(Source)

What is your complete HTML code ? Did you include jQuery ? (I included a snippet to show you that it works) — Aurel, Apr 22 '16 at 10:03
I edided my answer in case you just want to reload/refresh your image (doing another call to `captcha.jpg`) — Aurel, Apr 22 '16 at 11:10

img src not changed in jQuery script in Firefox and IE

1 Answers1