我需要在禁用的按钮上显示工具提示,并在启用的按钮上删除它。目前,它的工作原理是相反的。
扭转这种行为的最佳方法是什么?
$('[rel=tooltip]').tooltip();
<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"/>
<hr>
<button class="btn" disabled rel="tooltip" data-title="Dieser Link führt zu Google">button disabled</button>
<button class="btn" rel="tooltip" data-title="Dieser Link führt zu Google">button not disabled</button>
这里有一个demo http://jsfiddle.net/BA4zM/68/
PS:我想保留disabled
属性。
您可以包装禁用的按钮并将工具提示放在包装上:
<div class="tooltip-wrapper" data-title="Dieser Link führt zu Google">
<button class="btn btn-default" disabled>button disabled</button>
</div>
如果包装纸有display:inline
那么工具提示似乎不起作用。使用display:block
and display:inline-block
似乎工作正常。它似乎与浮动包装纸一起工作得很好。
更新 这是更新后的 JSFiddle,可与最新的 Bootstrap (3.3.6) 配合使用。感谢@JohnLehmann 的建议pointer-events: none;
对于禁用的按钮。
http://jsfiddle.net/cSSUA/209/ http://jsfiddle.net/cSSUA/209/
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)