[Solved] add link to each image with jquery [closed]

by


This should do as you want:

$("div .copy-url").each(function() {
  var imgval = $(this).find('.copy-url').val();
  var sharer = "<a class="share" href=""+imgval+"">share</a>";
  $(this).append(sharer)
});

You had the following mistakes:

  • You had mismatching quotes in "<a class="share">" should be "<a class="share">"

  • In the line $('.copy-url').val you are missing $(this).find and () after your .val. Should be $(this).find('.copy-url').val()

  • You have no div with the class copy-url in your code.

Demo

$(document).ready(function() {
  $(".copy-url").click(function() {
    $(this).select();
    document.execCommand("copy");
  })

  if (true) { //will be replaced by navigator.share, value will be url
    $("div").each(function() {
      var imgval = $(this).find('.copy-url').val();
      var sharer = "<a class="share" href=""+imgval+"">share</a>";
      $(this).append(sharer)
    });
  }

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div><input type="text" class="copy-url" value="222222" readonly="yes">
  <span class="share">copy</span> </div>

<div><input type="text" class="copy-url" value="333333" readonly="yes">
  <span class="share">copy</span></div>

<div><input type="text" class="copy-url" value="444444" readonly="yes">
  <span class="share">copy</span></div>

<div><input type="text" class="copy-url" value="555555" readonly="yes">
  <span class="share">copy</span></div>

<div><input type="text" class="copy-url" value="666666" readonly="yes">
  <span class="share">copy</span></div>

solved add link to each image with jquery [closed]