• bootstrap modal


    模态框提供了两个可选尺寸,通过为 .modal-dialog 增加一个样式调整类实现。加modal-lg,加modal-sm,不加也可以,共有三种尺寸。

    触发方式,data-target, 感觉比js得好用

    触发modal的元素,给modal传值:可传多个值

    <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal" data-user='sfp' data-name='hh'>
          Launch demo modal
        </button>
    
    $('#myModal').on('show.bs.modal', function(event){
          var button = $(event.relatedTarget);
          var user = button.data('user');
          var name = button.data('name');
          console.log(user);
          console.log(name);
        })
    

    hide的话,就找不到谁触发modal的元素

      

    button 中也可以通过href来触发,不过一般不会这么写 

    传参可以通过data-或者option

    backdrop:static,点击遮罩层,模态框不会被关闭

    backdrop:false,遮罩层,不会变灰

    keyboard:键盘上的 esc 键被按下时关闭模态框。

    show:模态框初始化之后就立即显示出来。  也很有用,再加某个条件才能show;如果一个modal是否立即显示 是唯一的,才可以这样用;如果一个按钮,点击之后,还要判断是否触发,就不能在modal上设置show了。

    remote:如果提供的是 URL,将利用 jQuery 的 load 方法从此 URL 地址加载要展示的内容(只加载一次)并插入 .modal-content 内。如果使用的是 data 属性 API,还可以利用 href 属性指定内容来源地址。下面是一个实例:

    <a data-toggle="modal" href="remote.html" data-target="#modal">Click me</a>  

       

    方法:

    .modal('toggle'):在模态框显示或隐藏之前返回到主调函数中(也就是,在触发 shown.bs.modal 或 hidden.bs.modal 事件之前)。
    .modal('show'):在模态框显示之前返回到主调函数中 (也就是,在触发 shown.bs.modal 事件之前)。
    .modal('hide'):在模态框隐藏之前返回到主调函数中 (也就是,在触发 hidden.bs.modal 事件之前)。
    .modal('handleUpdate'):modal open,height change,readjust modal's position.

    事件:

    show.bs.modal:show 方法调用之后立即触发该事件。如果是通过点击某个作为触发器的元素,则此元素可以通过事件的 relatedTarget 属性进行访问。
    shown.bs.modal:此事件在模态框已经显示出来(并且同时在 CSS 过渡效果完成)之后被触发。如果是通过点击某个作为触发器的元素,则此元素可以通过事件的 relatedTarget 属性进行访问。
    hide.bs.modal:hide 方法调用之后立即触发该事件。
    hidden.bs.modal:此事件在模态框被隐藏(并且同时在 CSS 过渡效果完成)之后被触发。
    loaded.bs.modal:从远端的数据源加载完数据之后触发该事件。

    如果想点击modal中的按钮,触发一定的事件,只能自己添加了。因为唯一的操作hide,不能区分是否要上传文件。

    官网写的是,show之后传参和识别事件源;现在我想hide之后识别事件源,应该只能自己找了。

  • 相关阅读:
    !!!最常用正则表达式语法
    RunMessageScript from spy
    已知进程、线程、窗体三者中某一个的句柄,需要查找另外两者的句柄。
    如何抓取一个当前运行软件所使用的内存
    谢谢你的伤害
    游摸底河有感
    九月无诗
    游石人公园有感
    影响35岁前成功的好习惯与坏习惯
    创业经验十二谈,愿有志者共勉(转)
  • 原文地址:https://www.cnblogs.com/wang-jing/p/4773293.html
Copyright © 2020-2023  润新知