Question

我有很多下载链接。我想点击每个下载链接后打开相同的模式。我通过创建两个链接实现了这一点，一个用于模态，一个用于下载，隐藏下载链接，然后在单击模态链接时触发其上的click事件。唯一的问题是它不适用于多个下载链接。我尝试在每个文件的链接上使用不同的id并从单独的模态链接触发每个dwnload但它不起作用。

<ul class="list-group">
   <li class="list-group-item">2016
     <a class="pull-right" href="#" data-toggle="modal" data-target="#myModal" rel="nofollow" download id="modal1"><i class='fa fa-download'>Download</i></a>
     <a href="https://drive.google.com/uc?export=download&id=0Bw41ZfJHqw5IU01JQ0haanBfOFE" id="download1" class="hidden">aa</a></li>
   <li class="list-group-item">2015
     <a class="pull-right" href="#" data-toggle="modal" data-target="#myModal" rel="nofollow" download id="modal2"><i class='fa fa-download'>Download</i></a>
     <a href="https://drive.google.com/uc?export=download&id=0Bw41ZfJHqw5IWjZiM0ozNEVNZFU" id="download2" class="hidden">aa</a></li>
  </ul>

这些是链接。这是模态;

div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title" id="myModalLabel">Your download will begin shortly...</h4>
      </div>
      <div class="modal-body">
        this is the modal body
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>

这是javascript

$('[data-toggle=modal]').on('click', function(e) {
  var $target = $($(this).data('target'));
  $target.data('triggered', true);
  setTimeout(function() {
    if ($target.data('triggered')) {
      $target.modal('show').data('triggered', false);
    };
  }, 1000); // milliseconds
  return false;
});

$('#modal1').click(function(){
  $('#download1').trigger('click');
});
$('#modal2').click(function(){
  $('#download2').trigger('click');
});

请问有什么问题？

下载多个下载链接后显示模态

0 个答案: