Question

我正在使用text-angular指令来显示内容。现在，当用户在某些文本上悬停时，我想在那里显示工具提示，。

       <div text-angular id="htmlEditorId" ng-class="totalOrphans == 0 ? 'add-heightTo-textEditor' : 'html-editor-container'" class="textcontent-modal"
                            spellcheck="false" ng-model="data.htmlDocument" ta-disabled="isEditingDisabled" ng-mouseup="doSomethingWithSelectedText($event)"
                            ng-onkeyup="doSomethingWithSelectedText($event)" name="editor1">
                        </div>
 <span class="tooltiptext">Tooltip text</span>

我尝试使用ng-mouseover方法尝试添加工具提示

$scope.show_Tool_Tip_OnHover = function(event) {
          if(event.target.nodeName === "SPAN"){
            $scope.show_tool_tip = true;
          } else {
            $scope.show_tool_tip = false;
          }
        }

现在，但是当我将鼠标悬停在文本上时，我看不到任何工具提示。指令是 - ＆gt;

textangular

任何人都能帮助我吗？

Answer 1

我没有看到在div元素上启动ng-mouseover函数来触发使用范围定义的show_Tool_Tip_OnHover函数。

最好为div声明title属性并为其分配所需的内容。因此，它自然会向您显示浏览器默认工具提示，而无需编写任何额外代码，也是安全的。

https://www.w3.org/TR/html4/struct/global.html#h-7.4.3

<div text-angular 
    id="htmlEditorId" 
    ng-class="totalOrphans == 0 ? 'add-heightTo-textEditor' : 'html-editor-container'" 
    class="textcontent-modal"
    spellcheck="false" ng-model="data.htmlDocument" 
    ta-disabled="isEditingDisabled" 
    name="editor1" 
    title="Tooltip text">
</div>

在文本角度文本上添加工具提示

1 个答案: