雅安论坛

标题: Bootstrap向弹出的模态框传递参数 [打印本页]

---

作者: 匿名    时间: 2023-7-31 22:28
标题: Bootstrap向弹出的模态框传递参数
1.Bootstrap向弹出的模态框传递参数

在一新闻列表页面，点击每一条信息，都打开一个模态框用来显示新闻的详情。那么如何向模态框传值，知道我要打开的是那一篇新闻呢？先看代码。

1. <div class="new_main" onclick="NewsDetail('2')"> </div>
   

复制代码

这里写的div里面有个NewsDetail的方法，里面是参数。页面上加一个隐藏的input框

1.    <input type="hidden" id="newsid">
   

复制代码

然后见证奇迹。

1. $(function () {
   
2.         //绑定模态框展示的方法
   
3.         window.NewsDetail= function (id) {
   
4.             $("#newsid").val(id);
   
5.             $('#myModal').modal('show');
   
6.         }
   
7.         $('#myModal').on('show.bs.modal', function (event) {
   
8.             var newid = $("#newsid").val();
   
9.             var modal = $(this);  //get modal itself
   
10.             modal.find('.modal-body iframe').attr("src", "detail.html?newsid=" + newid);
    
11.         });
    
12.     })

复制代码

触发NewsDetail方法的时候，先给隐藏的input赋值，然后在myModal这个模块框里取值，给模态框里面的元素赋值就行了。

原文出处：https://blog.csdn.net/u012869793/article/details/84453145

---

欢迎光临 雅安论坛 (https://www.yaanbbs.net/)

Powered by Discuz! X3.4