• 基于bootstrap 在同一个界面弹出不同的模态框


    同一个页面如何操作多个模态框的弹出

    <button class="btn btn-info" data-toggle="modal" data-target="#myModal">第一个模态框</button>
     
    <button class="btn ben-default" data-toggle="modal" data-target="#myModal_2">第二个模态框</button>
     
            <!--第一个模态框的ID为myModal-->
            <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">×
                        </button>
                        <h4 class="modal-title" id="myModalLabel">
                            <!--模态框标题-->
                        </h4>
                    </div>
                    <div class="modal-body" style=" 550px; margin: 0px auto;">
                        <!-- 添加你的弹窗内容 -->
                        
                        <!-- 添加你的弹窗内容 -->
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" 
                        data-dismiss="modal">关闭
                    </button>
                    <button type="button" class="btn btn-primary" id="input-button" onclick="setUserGold()">
                        PY成功 <!--成功的按钮-->
                    </button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->
     
     
     
    <!--第二个模态框的ID为myModal_2-->
            <div class="modal fade" id="myModal_2" 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">
                            <!--模态框标题-->
                        </h4>
                    </div>
                    <div class="modal-body" style=" 550px; margin: 0px auto;">
                        <!-- 添加你的弹窗内容 -->
                        
                        <!-- 添加你的弹窗内容 -->
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" 
                        data-dismiss="modal">关闭
                    </button>
                    <button type="button" class="btn btn-primary" id="input-button" onclick="setUserGold()">
                        PY成功 <!--成功的按钮-->
                    </button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->
    --------------------- 
    作者:ChiangShenHung 
    来源:CSDN 
    原文:https://blog.csdn.net/jinshong/article/details/83501880 
    
  • 相关阅读:
    判断字符串是否包含某一个值方法
    生成一个随机手机号
    python 常用数据类型及操作方法
    selenium 常用的定位方法
    mysql 多表查询
    转载--python全栈开发学习
    Jenkins执行jmeter自动化脚本方法
    阅读方法
    pytorch学习
    英文阅读材料记录
  • 原文地址:https://www.cnblogs.com/yangwenyu/p/10649825.html
Copyright © 2020-2023  润新知