Dynamic JavaScript Image SRC Path Replacement

Question

I'm trying to use JS to dynamically replace an image on a page based upon the value of the selected option of a select dropdown. Everything in the code I've included below works perfectly. My "selected_text" variable is properly pulling the value of the selected option in my select dropdown, but I need to somehow write that value to the replacement img src path.

IE: If someone selects "Audi" from my select dropdown, I want to write "Audi" where I have "[selected_text]" in my replacement img src path.

Any ideas?

<script type="text/javascript">
function popmake() {
    var w = document.vafForm.make.selectedIndex;
    var selected_text = document.vafForm.make.options[w].text;
    document.getElementById('make-image').src="/path/to/images/[selected_text].jpg";
}
</script>

dalton · Accepted Answer · 2010-07-08 21:01:48Z

6

what about

document.getElementById('make-image').src="/path/to/images/" + selected_text + ".jpg";

answered Jul 8, 2010 at 21:01

dalton

3,6861 gold badge27 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

aegenes Over a year ago

Awesome, I knew it'd be something simple like this. I'm still learning so thank sfor your help!

JAL · Accepted Answer · 2010-07-08 21:00:19Z

4

It's simple as string concatenation:

document.getElementById('make-image').src="/path/to/images/"+selected_text+".jpg";

answered Jul 8, 2010 at 21:00

JAL

21.6k1 gold badge50 silver badges67 bronze badges

Comments

Francisco Soto · Accepted Answer · 2010-07-08 21:01:31Z

0

Well, you could have that string somewhere like:

var path_to_images = "/path/to/images/[selected_text].jpg";

... code ...

var selected_text = document.vafForm.make.options[w].text;

document.getElementById('make-image').src = path_to_image.replace("[selected_text]", selected_text);

answered Jul 8, 2010 at 21:01

Francisco Soto

10.4k2 gold badges40 silver badges46 bronze badges

Collectives™ on Stack Overflow

Dynamic JavaScript Image SRC Path Replacement

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related