转：data-toggle与data-target的作用

最新推荐文章于 2021-04-18 11:28:56 发布
最新推荐文章于 2021-04-18 11:28:56 发布
阅读量132 收藏
点赞数
原文链接：http://www.cnblogs.com/xxh-2014/p/10364816.html
版权

https://blog.csdn.net/yzllz001/article/details/73611442

 

<a href="login.html" data-toggle="modal" data-target="#signin-signup-tab" id="signin-button" class="pull-right">Sign In</a>

　　

因为Bootstrap为这些元素都绑定上了事件，而终止了链接默认行为，你可以看看Bootstrap的文档，data-toggle指以什么事件触发，常用的如modal,popover,tooltips等，data-target指事件的目标,你这段代码的意思就是指将#signin-signup-tab这个Dom元素的内容以模态框的形式展示。

转载于:https://www.cnblogs.com/xxh-2014/p/10364816.html

weixin_30698297
关注
使用bootstrap的data-target 实现页面上的3级展示、隐藏的效果
xiaocainiao_notebook的博客
09-05 4454
PS:最近客户看到别的网站的展示效果就让我们也做成那样；但是要做成3级展示和隐藏；一个大的分类下面有一小分类，小分类下面还有具体的问题展示。 思路：1、在java后台 拼接html在发给前端             2、java后台传数据到前端再在js里面拼接成html 最后选用方法2； 说明一下我们使用的bootstrap 隐藏和显示使用的 :  data-target='#id'  ...
data-toggle与data-target的作用
无知的博客
06-22 8万+
SignIn ：因为Bootstrap为这些元素都绑定上了事件，而终止了链接默认行为，你可以看看Bootstrap的文档，data-toggle指以什么事件触发，常用的如modal,popover,tooltips等，data-target指事件的目标,你这段代码的意思就是指将#signin-signup-tab这个Dom元素的内容以模态框的形式展示。
data-toggle data-target
weixin_33811539的博客
07-12 172
data-toggle https://stackoverflow.com/questions/30629974/how-does-the-data-toggle-attribute-work-whats-its-api I think you are a bit confused on the purpose of custom data attributes. From the w3 ...
data-toggle与data-target是什么作用
热门推荐
d295968572的博客
02-23 12万+
Bootstrap为这些a之类元素都绑定上了事件，而终止了链接默认行为。 data-toggle指以什么事件触发，常用的如modal,popover,tooltips等，data-target指事件的目标，一起使用就是代表data-target所指的元素以data-toggle指定的形式显示 data-target 与data-toggle 还有data-spy 文档总是给
data-toggle和data-target
a20001999的博客
04-18 3953
data-toggle: 常用的三个值:modal,popover,tooltips ①modal:模态框，可以在父窗体上覆盖一个子窗体，通过data-target指向想以模态框表示的目标。 比如:我想通过点击按钮出现一个子窗体(有点像弹出一个小页面那种)，就可以将 data-target="#要显示的部分的id"。 效果:点击按钮时，子窗体的内容就是要显示的部分的内容 ②popover:弹出框 通过title=“你想设置的弹出框的标题”，data-content="你想显示的内容"来设置你的弹出框。 比如
电商二十五、Bootstrap的data-toggle="modal"、data-toggle="popover"、data-toggle="tooltips" data-target=“#id值”
lbh19630726的博客
08-11 2137
①bootstrap的data-toggle="modal" data-target=“#弹出窗口（div）的id” 新建一个文件夹：bootstrapdemo文件夹 引入bootstrap.min.js文件 新建文件bootstrap-modal.html 引入bootstrap.min.css文件和jquery-2.2.3.min.js文件 文件bootstrap...
bootstrap中导航条data-toggle=collapse与data-target的联动
weixin_44649210的博客
04-10 6288
理想效果： 当浏览器页面大于768px时，导航条最右侧的菜单按钮隐藏 当浏览器页面小于768px时，可以点击菜单按钮显示、隐藏下拉菜单 代码： data-toggle用于控制隐藏无序列表，data-target用于指定被作用无序列表 data-toggle的其他属性： ...
Bootstrap中data-target 到底是什么
12-11
data-target 与data-toggle 还有data-spy 文档总是给人一种很突兀的方式给出来，然后又没有好好解释或者是我看的不够仔细？ HTML5允许开发者自由为其标签添加属性，这种自定义属性一般用“data-”开头。 我目前理解...
data-toggle="dropdown"/data-target/data-dismiss/data-backdrop/data-spy/data-slide/data-source是什么意思？
哈里·雪利博客
12-12 5541
在Bootstrap框架中查阅图灵计算机大词典： data-toggle="dropdown"： n.数据柄-下拉菜单模块； 功能作用：开启，打开，切换，删除，关闭，下拉，监听，触发，引入，输入，弹出，绑定,控制或隐藏等等......功能作用。 data-toggle即作为数据柄栓媒介把其后面"dropdown"下拉菜单添加切换到诸如按钮button等页面元素上，起到联动中介，点击下拉
data-toggle与data-target的区别
weixin_44627672的博客
08-18 595
如下代码： <a href="login.html" data-toggle="modal" data-target="#signin-signup-tab" id="signin-button" class="pull-right">Sign In</a> 因为Bootstrap为这些元素都绑定上了事件，而终止了链接默认行为，你可以看看Bootstrap的文档，data-toggle指以什么事件触发，常用的如modal,popover,tooltips等，data-target
data-toggle与data-target的区别BESBV
ZHJ925017的博客
03-16 598
LIANGZHE区别BDEB Bootstrap为这些a之类元素都绑定上了事件，而终止了链接默认行为。 data-toggle指以什么事件触发，常用的如modal,popover,tooltips等，data-target指事件的目标，一起使用就是代表data-target所指的元素以data-toggle指定的形式显示 data-target 与data-toggle 还有data-sp...
Bootstrap中的data-target和data-toggle实现组件隐藏/显示
qq_41218239的博客
10-31 1万+
Bootstrap中的data-target和data-toggledata-target和data-toggle介绍data-toggle介绍data-target介绍使用示例总结 data-target和data-toggle介绍 在学习bootstrap框架时候，相信大家在前端设计时候也都有遇到data-target和data-toggle，这是我们在隐藏组件和展开组件最常用的，现在做前端时...
data-toggle,data-target,data-dismiss
喵丶布
09-03 3249
data-toggle指以什么事件触发，常用的如collapse,modal,popover,tooltips等； data-target指事件的目标，一起使用就是代表data-target所指的元素以data-toggle指定的形式显示。 ...
bootstrap——data-toggle、data-target、collapse
Harrietjia的博客
03-24 4194
向元素中添加 role="navigation"，有助于增加可访问性。向 &lt;div&gt; 元素添加一个标题 class .navbar-header，内部包含了带有 class navbar-brand 的 &lt;a&gt; 元素。这会让文本看起来更大一号。为了给导航栏添加响应式特性，要折叠的内容必须包裹在带有 class .collapse（折叠）、.navbar-collapse 的...
@*「td id=@item.TraceKey data-toggle=“popover“」
学者-微风
07-02 164
@*<td id=@item.TraceKey data-toggle="popover"> 上面代码中的 data-toggle="popover"的作用是弹框显示； 附上代码测试链接： 菜鸟教程–该实例演示了通过 data 属性使用弹出框（Popover）插件的用法
Bootstrap 中： data-toggle 与 data-target 的作用
愿我如星君如月 ... 夜夜流光相皎洁 ...
03-18 5679
<button type="button" class="update-button" style="width:70px; height:40px;" data-toggle="modal" data-target=".update-Dialog" > 编辑 </button> &lt...
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#editModal" th:data-id="${user.user_id}" th:data-name="${user.user_name}" th:data-pass="${user.user_pass}" th:data-age="${user.user_age}" th:data-sex="${user.user_sex}" onclick="getUserInfo56(this.getAttribute('data-id'), this.getAttribute('data-name'), this.getAttribute('data-pass'),this.getAttribute('data-age'),this.getAttribute('data-sex'))"> 修改 </button>解释下这个代码
最新发布
06-02
该按钮同时定义了一些自定义属性，如"data-bs-toggle"和"data-bs-target"，用于激活模态框的行为。另外，这个按钮还使用了thymeleaf模板引擎的一些自定义属性，如"th:data-id"和"th:data-name"等，用于在调用...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值