Question

您好我希望每当输入[提交] 被禁用时，我的工具提示就会出现。禁用输入效果非常好，当输入[文本]无效但工具提示未显示时，它将被禁用。

这是我的代码：

<input type="submit"
       form="loginData"
       ng-disabled="loginData.login.$invalid || loginData.password.$invalid"
       class="btn btn-primary btn-md"
       ng-click="$ctrl.login()"
       value="Zaloguj"
       uib-tooltip="Wypełnij formularz!"
       tooltip-placement="top"
       tooltip-trigger="'mouseenter'"
       tooltip-append-to-body="true"
       tooltip-enable="loginData.login.$invalid || loginData.password.$invalid" />

tooltip-enable 指令应该在输入登录名或密码无效时启用工具提示但不起作用，请快速帮助！

编辑：我正在使用谷歌浏览器，所以我没有意识到这个解决方案实际上适用于其他浏览器（mozilla肯定）。但它仍然不适用于最新的谷歌浏览器，所以它不够令人满意。

总结新问题是如何在谷歌浏览器中解决该问题？

Answer 1

具有已禁用属性的HTML元素不会触发事件。

但不要担心，您可以使用简单的 div / span 和uib-tooltip指令作为已禁用输入/按钮的包装。

在您的情况下，您只想在禁用时显示工具提示，请尝试以下操作...（PLUNKER）

<强> HTML

<span uib-tooltip="Demo tooltip" 
      tooltip-enable="isBtnDisabled" 
      ng-class="{'my-tooltip': isDisabled}">
    <input type="submit" ng-disabled="isDisabled" class="btn btn-info" value="My btn">
</span>

<强> CSS

.my-tooltip {
  display: inline-block;
}

.my-tooltip input {
  position: relative;
  z-index: -1;
}

禁用输入时启用ui bootstrap工具提示

1 个答案: