thinkphp tp5 模板文件 循环输出 bootstrap 模态框 弹窗 获取 微信媒体文件素材 media_id

时间:2016-12-18 17:45:37   收藏:0   阅读:351

 

<!DOCTYPE HTML>
<html lang="zh-CN">
<head>
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1, user-scalable=no"/>
<meta http-equiv="Cache-Control" content="no-siteapp">
<meta name="renderer" content="webkit">
<meta name="description" content="">
<meta name="keywords" content="">

<link href="http://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<script src="http://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
<script src="http://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    

<script type="text/javascript" >

</script>

<style type="text/css">

</style>

<title>微信媒体文件管理</title>
</head>
<body>


<nav class="navbar navbar-default" role="navigation">
    <div class="container-fluid"> 
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse"  data-target="#example-navbar-collapse">
            <span class="sr-only">切换导航</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="#">广告管理系统</a>
    </div>
    <div class="collapse navbar-collapse" id="example-navbar-collapse">
        <ul class="nav navbar-nav">
            <li class="active"><a href="#">新建广告</a></li>
            <li><a href="#">微信文件</a></li>
            <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                    test <b class="caret"></b>
                </a>
                <ul class="dropdown-menu">
                    <li><a href="#">jmeter</a></li>
                    <li><a href="#">EJB</a></li>
                    <li><a href="#">Jasper Report</a></li>
                    <li class="divider"></li>
                    <li><a href="#">分离的链接</a></li>
                    <li class="divider"></li>
                    <li><a href="#">另一个分离的链接</a></li>
                </ul>
            </li>
        </ul>
    </div>
    </div>
</nav>
    
<div class="panel panel-default">
    <div class="panel-heading">
      <h2 class="panel-title" style=‘text-align:center;font-weight:600;‘>微信媒体文件管理</h2>
    </div>
    <div class="panel-body">
    <div class="table-responsive">
    <table class="table  table-striped">
        <caption>
       
        </caption>
        <thead>
            <tr>
            <th>序号</th>
            <th>标题title</th>
            <th>操作</th>
            </tr>
        </thead>
        <tbody>

        
            {volist name=‘item‘ id=‘vo‘ empty="暂时没有数据"}
                <tr>
                <td>    

                
 <button class="btn btn-primary btn-xs" data-toggle="modal" data-target="#{$i}">
    {$i}
</button>
<!-- 模态框(Modal) ------------------------------------------------------------>
<div class="modal fade" id="{$i}" 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">×
                </button>
                <h4 class="modal-title" id="myModalLabel">
                    {$i}
                </h4>
            </div>
            <div class="modal-body">
            <table class="table  table-striped" style="word-break:break-all; word-wrap:break-all;">
                <tr>
                <td>【title】{$vo.content.news_item.0.title}</td>
                </tr>
                <tr>
                <td>【digest】{$vo.content.news_item.0.digest}</td>
                </tr>
                <tr>
                <td>【url】{$vo.content.news_item.0.url}</td>
                </tr>
                <tr>
                <td>【thumb_url】{$vo.content.news_item.0.thumb_url}</td>
                </tr>
            </table>  
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">
                    关闭
                </button>
                <button type="button" class="btn btn-primary">
                    提交更改
                </button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal ------------------------------------------------------------------->
<script>
   $(function () { $(#{$i}).modal(hide)})});
</script>
<script>
   $(function () { $(#{$i}).on(hide.bs.modal, function () {
      alert(嘿,我听说您喜欢模态框...);})
   });
</script>           
            
                </td>
                <td><a href=‘{$vo.content.news_item.0.url}‘ target=‘_blank‘>{$vo.content.news_item.0.title|mb_substr=0,10,‘utf-8‘}...</a></td>
                <td><a href=‘{:url("found_ad",["media_id"=>$vo["media_id"]])}‘>新建广告</a></td>
                </tr>
            {/volist}
            

        </tbody>
    </table>
    </div>   
   </div>
</div>
    
</body>
</html>

 

评论(0
© 2014 mamicode.com 版权所有 京ICP备13008772号-2  联系我们:gaon5@hotmail.com
迷上了代码!