Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery image src change by radio button
    primarykey
    data
    text
    <p>I have this code but why when i click on any radio button the image src doesn't change?</p> <pre><code>&lt;html xmlns=&quot;http://www.w3.org/1999/xhtml&quot;&gt;<br/>&lt;head&gt;<br/> &lt;title&gt;Toggle Images using RadioButtons&lt;/title&gt;<br/> &lt;script type=&quot;text/javascript&quot;<br/> src=&quot;http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.2.min.js&quot;&gt;<br/> &lt;/script&gt;<br/> &lt;script type=&quot;text/javascript&quot;&gt;<br/> $(document).ready(function() {<br/> $(&quot;input:radio[name=style]&quot;).change(function() {<br/> if (this.value == &quot;tuxedo&quot;){<br/> var style = 'tuxedo';<br/> } else {<br/> var style = 'classic' ; <br/> }<br/> });<br/> $(&quot;input:radio[name=breast]&quot;).change(function() {<br/> if (this.value == &quot;double&quot;){<br/> var breast = 'double';<br/> } else {<br/> var breast = 'single' ; <br/> }<br/> });<br/> $(&quot;input:radio[name=buttons]&quot;).change(function() {<br/> if (this.value == &quot;4&quot;){<br/> var buttons = '4';<br/> } else if (this.value == &quot;3&quot;){<br/> var buttons = '3';<br/> } else if (this.value == &quot;2&quot;){<br/> var buttons = '2';<br/> } else {<br/> var buttons = '1' ; <br/> }<br/> });<br/> <br/> $(&quot;#imgDef&quot;).attr(<br/> 'src', 'http://127.0.0.1/2/suits/'+ style +'/'+ breast +'/'+ buttons +'.jpg' <br/> );<br/> });<br/> &lt;/script&gt;<br/>&lt;/head&gt;<br/>&lt;body&gt;<br/>Style:&lt;br /&gt;<br/>&lt;label&gt;&lt;input name=&quot;style&quot; type=&quot;radio&quot; value=&quot;classic&quot; /&gt;Classic&lt;/label&gt;&lt;br /&gt;<br/>&lt;label&gt;&lt;input name=&quot;style&quot; type=&quot;radio&quot; value=&quot;tuxedo&quot; /&gt;Tuxedo&lt;/label&gt;&lt;br /&gt;<br/>&lt;br /&gt;&lt;br /&gt;<br/>Breast:&lt;br /&gt;<br/>&lt;label&gt;&lt;input name=&quot;breast&quot; type=&quot;radio&quot; value=&quot;single&quot; /&gt;Single&lt;/label&gt;&lt;br /&gt;<br/>&lt;label&gt;&lt;input name=&quot;breast&quot; type=&quot;radio&quot; value=&quot;double&quot; /&gt;Double&lt;/label&gt;&lt;br /&gt;<br/>Buttons:&lt;br /&gt;<br/>&lt;label&gt;&lt;input name=&quot;buttons&quot; type=&quot;radio&quot; value=&quot;1&quot; /&gt;1&lt;/label&gt;&lt;br /&gt;<br/>&lt;label&gt;&lt;input name=&quot;buttons&quot; type=&quot;radio&quot; value=&quot;2&quot; /&gt;2&lt;/label&gt;&lt;br /&gt;<br/>&lt;label&gt;&lt;input name=&quot;buttons&quot; type=&quot;radio&quot; value=&quot;3&quot; /&gt;3&lt;/label&gt;&lt;br /&gt;<br/>&lt;label&gt;&lt;input name=&quot;buttons&quot; type=&quot;radio&quot; value=&quot;4&quot; /&gt;4&lt;/label&gt;&lt;br /&gt;<br/>&lt;img id=&quot;imgDef&quot; src=&quot;http://127.0.0.1/2/suits/classic/single/1.jpg&quot;/&gt;<br/>&lt;/body&gt;<br/>&lt;/html&gt;</code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload