CODEWITHSUNDEEP
javascriptjquery
Daiaiai
Daiaiai

Reputation: 1089

How do I add a value to a click

I'd like to add an attribute/value to each click of similar elements to use that value somewhere else. The code I'd like to use it is something like

<div class="productbox"><img src="image.png"></div>
<div class="productbox"><img src="image2.png"></div>
<div class="productbox"><img src="image3.png"></div>

<div class="differentcontainer">
<!-- the value of the image shall be put in here as <img src="..."> -->
</div>

$(".productbox").click(function() {
    var imgname = $(this).next(img).value;
$(".differentcontainer").html(imgname);
});

So I'd want to get the value of the comoplete img-tag and use it after a click on a different element. As I already use jquery this would possibly make most sense sticking to it .

Thanks!

Upvotes: 2

Views: 97

Answers (2)

Sinto
Sinto

Reputation: 3997

From jQuery Syntax

The jQuery syntax is tailor-made for selecting HTML elements and performing some action on the element(s). Basic syntax is:

$(selector).action();

A $ sign to define/access jQuery.

A (selector) to "query (or find)" HTML elements.

A jQuery action() to be performed on the element(s)

$(".productbox").click(function() {
  var imgname = $(this).html();
  $(".differentcontainer").html(imgname);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="productbox"><img style="width:50px; height:50px" src="https://i2.wp.com/mightywidow.com/wp-content/uploads/2016/12/11519100485_ddfd5be329_z.jpg?fit=640%2C361&amp;ssl=1" title="1"></div>
<div class="productbox"><img style="width:50px; height:50px" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSnXSQpzvR2frx8nzq-rxxQZsOjPtRWNVVRwoU7-NsUAtGYUOom" title="2"></div>
<div class="productbox"><img style="width:50px; height:50px" src="https://s-media-cache-ak0.pinimg.com/736x/e6/63/d0/e663d0bf3d57da87ef9992cddd5af05c--kindness-ideas-acts-of-kindness.jpg" title="3"></div>

<div class="differentcontainer">
  <!-- the value of the image shall be put in here as <img src="..."> -->
</div>

Upvotes: 2

Sachi Tekina
Sachi Tekina

Reputation: 1810

Juts get the html in the div, something like this:

$(".productbox").click(function() {
    var imgname = $(this).html();
		 $(".differentcontainer").empty();
     $(".differentcontainer").html(imgname);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="productbox"><img src="http://via.placeholder.com/350x150"></div>
<div class="productbox"><img src="http://via.placeholder.com/140x100"></div>
<div class="productbox"><img src="http://via.placeholder.com/200x100"></div>

<div class="differentcontainer">
<!-- the value of the image shall be put in here as <img src="..."> -->
</div>

Upvotes: 0

Related Questions