Firefox не отображает всплывающие подсказки по отключенным полям ввода

Ответ 1

Кажется, это (очень старая и очень заброшенная) ошибка. См. Ошибки Mozilla # 274626 # 436770

Я думаю, это также можно объяснить как предполагаемое поведение.

Один ужасный обход, который приходит на ум, состоит в том, чтобы наложить кнопку с невидимым div с атрибутом title, используя z-index; другой, чтобы как-то повторно активировать кнопку "onmouseover", но чтобы искусно перехватить и уничтожить любое событие click на этой кнопке.

Ответ 2

Я предполагаю, что вы используете некоторые фреймворки, такие как bootstrap. Если это так, он добавляет pointer-events: none к элементу "disabled", поэтому все события мыши игнорируются.

.btn[disabled] {
  pointer-events: auto !important;
}

может решить проблему.

Ответ 3

Вы можете обойти это с помощью кода jQuery, например:

    if ($.browser.mozilla) {
        $(function() {
            $('input[disabled][title]')
                .removeAttr('disabled')
                .addClass('disabled')
                .click(function() {return false})
            })
    }

Ответ 4

Величина z-индексации может быть выполнена следующим образом:

  .btnTip

  {

     position: absolute;

     left: 0%;

     right: 0%;

     z-index: 100;

     width: 50px;

     /*background-color: red;*/

     height: 17px;

  }

(...)

<div style="background-color: gray; width: 400px;">

  Set width of the tip-span to the same as the button width.

  <div style="text-align: center;">

     <span style="position:relative;">

        <span class="btnTip" title="MyToolTip">&nbsp;</span>

        <input type="button" name="" disabled="disabled" value="Save" style="width: 50px;height:17px;" />                                         

     </span>

  </div>             

Влево и вправо помогает позиционировать хост поверх отключенного элемента. Z-index определяет, на какой слой вы вставляете элемент.

Чем больше число z-слоя, тем больше он будет сверху.

Z-индекс хоста и/или отключенного элемента должен быть установлен динамически.

Когда отключенный элемент отключен, вы хотите, чтобы хост всплывающей подсказки сверху и наоборот - по крайней мере, если вы хотите, чтобы вы могли нажимать на свой элемент (кнопку), когда он НЕ отключен.

Ответ 5

Я столкнулся с подобной проблемой, и я мог бы исправить ее с помощью класса juery и small css, вам нужно было бы создать два новых элемента span и класс css, которые выглядят следующим образом

Просто добавьте их в общий файл js и css, который используется во всем приложении или на веб-сайте

.DisabledButtonToolTipSpan
{
position    :absolute;
z-index     :1010101010;
display     :block;
width       :100%;
height      :100%;
top         :0;         
}

Отобразить всплывающую подсказку для отключенной кнопки в браузере Firefox.

$(window).load(function() {
    if ($.browser.mozilla) {
                $("input").each(function() {
                    if ((this.type == "button" || this.type == "submit") && this.disabled) {

                        var wrapperSpan = $("<span>");
                        wrapperSpan.css({ position: "relative" });
                        $(this).wrap(wrapperSpan);

                        var span = $("<span>");
                        span.attr({
                            "title": this.title,
                            "class": "DisabledButtonToolTipSpan"
                        });
                        $(this).parent().append(span);
                    }
                });
            }
        });

Надеюсь, это поможет, Preetham.

Ответ 6

Вы можете использовать javascript. Используйте событие mouseover.

(У многих библиотек, таких как JQuery и Mootools, есть всплывающие подсказки для всплывающих подсказок).