javascript - Twitter Bootstrap中的数据切换属性(The data-toggle attributes in Twitter Bootstrap)

Question

What does data-toggle attributes do in Twitter Bootstrap?(data-toggle属性在Twitter Bootstrap中有什么作用？)

I couldn't find an answer in Bootstrap API.(我在Bootstrap API中找不到答案。)

I have seen a similar question before as well, link .(我之前也看过类似的问题， 链接 。)

But it didn't help me much.(但它对我帮助不大。)   ask by translate from so

Answer 1

It is a HTML5 data attribute that automatically hooks up the element to the type of widget it is.(它是一个HTML5数据属性，可以自动将元素与其窗口小部件类型挂钩。)

Some Examples:(一些例子：)

data-toggle="modal"
data-toggle="collapse"
data-toggle="dropdown"
data-toggle="tab"

Go through the JavaScript docs and search for data-toggle and you will see it used in the code examples.(浏览JavaScript文档并搜索数据切换，您将在代码示例中看到它。)

One working example:(一个工作的例子：)

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/> <div class="dropdown"> <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown trigger</a> <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel"> <li><a href="#">Item</a></li> </ul> </div>