Question

我只是在页面加载时才将鼠标放在工具提示上。当我登录网站时，页面加载后我将鼠标放在'？'上glyphicon符号，我能够看到在html中写的整个标题脚本。

这是我在悬停时看到的以下文字。这是标题，工具提示内有关闭按钮'x'。

About your score<button type=button class=close data-dismiss=popover aria-hidden=true onclick=$('#abcPopover').popover('hide')>&times;</button>

我点击了工具提示。当我点击'？' glyphicon符号弹出窗口不会在第一次单击时出现，脚本现在正在隐藏。当我点击'？' glyphicon符号第二次它正常工作popover即将来临。这是我只在页面加载和点击“？”时看到的问题。 glyphicon符号标题将隐藏，并在第二次单击工作正常和popover将出现。

这是我用html编写的代码。

<a href="#" id="abcPopover" data-html="true"
                   title="About your score<button type=button class=close data-dismiss=popover aria-hidden=true onclick=$('#abcPopover').popover('hide')>&times;</button>"  
                   data-toggle="popover" data-content="{{abcTooltip}}" ng-click="open()"><i class="glyphicon glyphicon-question-sign"></i></a>

Answer 1

在Html标记中嵌套按钮根据HTML5 Spec Document from W3C，它不是有效的HTML5：

内容模型：透明，但必须没有互动内容后代。

a元素可以包裹整个段落，列表，表格，   等等，甚至整个部分，只要没有互动   内容（例如按钮或其他链接）。

换句话说，您可以嵌套除以下内容之外的任何元素：

<a>

<audio>（如果存在controls属性）

<button>

<details>

<embed>

<iframe>

<img>（如果存在usemap属性）

<input>（如果type属性不处于隐藏状态）

<keygen>

<label>

<menu>（如果type属性处于工具栏状态）

<object>（如果存在usemap属性）

<select>

<textarea>

<video>（如果存在controls属性）

但是，如果您的<button>标记使用CSS设置样式并且看起来不像系统的小部件...帮自己一个忙，为{{1}创建一个新类以同样的方式标记和设置样式。

选中此链接以创建工具提示。 Link

Fiddle

当我将鼠标悬停在工具提示

1 个答案: