JSFiddle - React, Tailwind, and code Playground

by Gabriel Rodrigues

HTML

<a href="#" parametro="imagem1.jpg" class="abrirModal"><img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=1&w=100&h=100" /></a>
<a href="#" parametro="imagem2.jpg" class="abrirModal"><img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=2&w=100&h=100" /></a>
<a href="#" parametro="imagem3.jpg" class="abrirModal"><img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=3&w=100&h=100" /></a>
<a href="#" parametro="imagem4.jpg" class="abrirModal"><img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=4&w=100&h=100" /></a>


<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Exemplo</h4>
      </div>
      <div class="modal-body text-center">
        <img src="" />
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Sair</button>
      </div>
    </div>
  </div>
</div>

JavaScript

$(".abrirModal").click(function() {
  var url = $(this).find("img").attr("src");
  $("#myModal img").attr("src", url);
  $("#myModal").modal("show");
});