专栏首页java 微风Bootstrap 中: data-toggle 与 data-target 的作用

Bootstrap 中: data-toggle 与 data-target 的作用

   <button
      type="button"
      class="update-button"
      style="width:70px; height:40px;"
      data-toggle="modal"
      data-target=".update-Dialog"
    > 编辑
   </button>


 <div class="modal fade update-Dialog">
  ...
 </div>

点击编辑按钮,弹出一个静态框。

如上例子中的 button,Bootstrap 为这个元素都绑定了特定事件,覆盖了这些元素原本的行为,

data-toggle:触发事件的类型,如 modal,popover,tooltips 等

data-target :事件的作用对象 。

以上代码意思:把 class 为 “ update-Dialog ” 的 div 作用为一个 modal(静态框)。

运行效果:

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 解决:elasticsearch 更新报错:The number of object passed must be even but was [1]

    微风-- 轻许--
  • 解决:which: no java in (/root/chengxu/maven/apache-maven-3.5.2/bin:/usr/local/sbin:/usr/local/bin:/usr

    微风-- 轻许--
  • Docker logs 查看实时日志(日志最后的N行、某刻后日志)

    当我们输入 docker logs 的时候会转化为 Docker Client 向 Docker Daemon 发起请求,。

    微风-- 轻许--
  • BeautifulSoup解析html介绍

    爬虫抓取的数据以html数据为主。有时也是xml数据,xml数据对标签的解析和html是一样的道理,两者都是<tag>来区分数据的。这种格式的数据结构可以说是一...

    震八方紫面昆仑侠
  • 如何在小程序中获取用户信息

    在以前的文章中,我们介绍了小程序的登录鉴权功能,方便开发者去获取用户的appid和session_key以便确认用户的身份。但是,仅仅通过appid和sessi...

    it大叔
  • 第3期 | EasyLogger,一款轻量级且高性能的日志库

    本专栏由Mculover666创建,主要内容为寻找嵌入式领域内的优质开源项目,一是帮助开发者使用开源项目实现更多的功能,二是通过这些开源项目,学习大佬的代码及背...

    Mculover666
  • python+shell 备份 CSDN 博客文章,CSDN博客备份工具

    在 csdn 写了几年的博客了。多少也积累了两三百篇博文,近日,想把自己的这些文章全部备份下来,于是开始寻找解决方案。

    FungLeo
  • 你头疼的ELK难题,本文几乎都解决了

    - c:\Users\Administrator\Desktop\performanceTrace.txt

    lyb-geek
  • 详解python中GPU版本的opencv常用方法介绍

    本篇是以python的视角介绍相关的函数还有自我使用中的一些问题,本想在这篇之前总结一下opencv编译的全过程,但遇到了太多坑,暂时不太想回看做过的笔记,所以...

    砸漏
  • taf 异步调用源码分析

    对于服务端来说,异步处理相比同步处理在性能上可能会有成倍的提高,本篇就对 taf 的异步处理进行一个简单的分析。描述客户端进行异步调用之后,taf 的都进行了哪...

    赵威

扫码关注云+社区

领取腾讯云代金券