Bootstrap如何弹出modal窗，并动态传值

<div class="modal fade" id="qrcode" tabindex="-1" role="dialog" aria-labelledby="information">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">
          <span>&times;</span>
        </button>
        <h4 class="modal-title">请扫描二维码，完成支付</h4>
      </div>
      <div class="modal-body" style="text-align: center">
        <p id="message"></p>
        <img src="" alt="QRCode" id="scan">
      </div>
    </div>
  </div>
</div>
<button id="popup" class="btn  btn-primary btn-lg btn-block">我弹</button>

$(function () {
    $('#popup').on('click', function(){
      $('#qrcode').modal('show');
    });
    $('#qrcode').on('show.bs.modal', function (event) {
      var modal = $(this);  //get modal itself
      modal.find('.modal-body #message').text('your message');
      modal.find('.modal-body #scan').attr("src", 'image src');
    });
  });

注意怎么展示和传值呢？

展示：点击事件触发后，用$('#模型框id').modal('show');

传值：

$(function () {
    $('#popup').on('click', function(){
      $('#qrcode').modal('show');//展示
    });
    $('#qrcode').on('show.bs.modal', function (event) {//模型框显示后，可以定义里面的值，这个不是动态的值，用处不大
      var modal = $(this);  //get modal itself
      modal.find('.modal-body #message').text('your message');
      modal.find('.modal-body #scan').attr("src", 'image src');
    });
  });

方法二：

直接传递的是动态的值：

将页面数据传递到modal的首要步骤：把要传过去的值添加在在触发模态框的标签上

然后通过js把值从页面传递到模态框中：

$(function() {

$('#discussionModifyModal').on('show.bs.modal', function (event) {

 var a = $(event.relatedTarget) // a that triggered the modal

 var id = a.data('id'), title = a.data('title'), description = a.data('description'); 

 var modal = $(this)

 modal.find('#cm-modal-id').val(id);

 modal.find('#cm-modal-title').val(title);

 modal.find('#cm-modal-content').val(description);

});

});

原博：

https://blog.csdn.net/u013810234/article/details/76988402

http://blog.sina.com.cn/s/blog_b645c7fb0102wp7d.html