Skip to content
← Back to Community
changing image on click using JavaScript
Profile icon
ZControls_Games

So every time someone clicks "Change Picture" I want it to change to the other pictures in my other files but I don't know how to do it with JavaScript.

Javascript instead of HTML

Voters
Profile icon
LucasChanuh
Profile icon
XdekHaker
Profile icon
ZControls_Games
Comments
hotnewtop
Profile icon
Geocube101

You're missing a comma on line 3
Anyway, just change the <img> source to the new file

Without JQuery
document.getElementById('fran').src = 'new_path';

With JQuery
$('#fran').attr('src', 'new_path');

Using Javascript to Change Picture Source

var pics = [ "fr.jpg", "fra.jpg", "fran.jpg" ]; function change() { var new_index = pics.indexOf(document.getElementById('fran').src) + 1; if (new_index > len(pics) - 1) { new_index = 0; } document.getElementById('fran').src = pics[new_index]; }
Profile icon
ZControls_Games

@Geocube101 Thanks very much.

Profile icon
Geocube101

You're welcome, @ZControls_Games

Profile icon
ZControls_Games

It still doesn't work
@Geocube101

Profile icon
ash15khng

@ZControls_Games Which method are you using? You may need to get jQuery if you are using it. Add this in your document's head: <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

Profile icon
ZControls_Games

Ok I will try [email protected]