JQuery.toggle() не работает с TR в IE

Ответ 1

Я столкнулся с такой же ошибкой в ​​tr в таблицах. Я провел некоторое расследование, используя инструмент отладки IE8 script.

Сначала я попытался использовать toggle:

$(classname).toggle();

Это работает в FF, но не в IE8.

Затем я попробовал это:

if($(classname).is(":visible"))//IE8 always evaluates to true.
     $(classname).hide();
else
     $(classname).show();

Когда я отлаживал этот код, jquery всегда считал его видимым. Поэтому он закрыл бы его, но тогда он никогда не откроет его.

Затем я изменил его на следующее:

var elem = $(classname)[0];
if(elem.style.display == 'none')
     $(classname).show();
else
{
     $(classname).hide();               
}

Это сработало нормально. jQuery получил ошибка в нем или, может быть, мой html немного застенчивый. В любом случае, это устранило мою проблему.

Ответ 2

Обновление до jQuery 1.4 исправляет это, хотя я нахожусь в этом, но единственное "исправление" на этой странице, которое работало для меня, было ответом мальчика:

$(document).ready(function() {  
  $(".readOnlyRow").hide();  
  $("#readOnlyRowsToggle").click(function() {  
    $(".readOnlyRow").toggle($('.readOnlyRow').css('display') == 'none');  
  });  
});

Ответ 3

Удалите период с <tr class=".readOnlyRow"><td>row</td></tr>. Синтаксис для выбора класса jQuery заключается в том, чтобы добавить его с периодом, но он не нужен в вашем коде HTML.

Ответ 4

Я обнаружил, что, хотя это не работает в IE8

$('.tableRowToToggle').toggle();

но это работает:

$('.tableRowToToggle').each(function(){this.toggle()});

Получил идею из ссылки jAST, размещенной здесь до

Ответ 5

Я исправил эту проблему, скрыв дочерние элементы TR.

toggleTr($(".toggletr"));

function toggleTr(el) {
    $(el).children('td').each(function() {
        $(this).toggle();
    });
}

Кажется, это нормально для FF3.5/FF3/IE8/IE7/IE6/Chrome/Safari.

Ответ 6

Просто столкнулся с этим сам - самое легкое решение, которое я нашел, это проверить:

: нет (: скрытый)

вместо

: видимый

тогда действуйте соответственно..

Ответ 7

Похоже, это было исправлено в JQuery 1.4.

Ответ 8

Таблицы - интересная часть html, они не соответствуют нормальным правилам как другие элементы.

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

По сути, в старых браузерах свойства отображения были минимальными, и поток был оставлен в основном недокументированным, поэтому вместо изменения предопределенных значений для тега table/tr/td лучше всего добавить и удалить следующий класс и просто переключить сам класс вкл. и выкл. по атрибуту таблицы /tr/td.

.tableHide {
    display: none;
}

<table>
<tr><td> Visible content</td></tr>
<tr><td> Visible content</td> <td class="**tableHide**"> **Hidden Content**</td></tr>
</table>

Причиной этого является то, что это отдельный класс, используемый для переключения отображения, поэтому ничто в самой таблице не изменяется, и ни один из свойств таблиц не нуждается в изменении, отображении и любых связанных свойствах макета сохраняются даже если браузер не делает это легко за кулисами.

Ответ 9

$(document).ready(function() {  
    $(".readOnlyRow").hide();  
    $("#readOnlyRowsToggle").click(function() {  
        $(".readOnlyRow").toggle($('.readOnlyRow').css('display') == 'none');  
    });  
});

Есть ошибка jQuery, которую IE8 заставляет все оценивать как true. Попробуйте выше

Ответ 10

У меня была такая же проблема, но я нашел хорошее обходное решение, чтобы сделать toggle/slideToggle работать во всех браузерах.

<a id="myButton">Click</a>
<div id="myDiv" display="none">lorem ipsum .... text ....</div>  

и теперь JS:

    jQuery("#myButton").click(function () {
  var currentDisplay = jQuery("#myDiv").css("display"); // save the current Display value
  jQuery(#myDiv).slideToggle("fast", function () { // lets do a nice slideToggle
    // this code will run AFTER the sildeToggle is done
    // so if slideToggle worked fine (in FF, chrome, ...) this will have no evect, since the value is already block or none
    // but in case IE 8 runs this script, it will set the css display to the current value
    if (currentDisplay == "none") {
      jQuery(#myDiv).css('display', 'block');
    }else {
      jQuery(#myDiv).css('display', 'none');
        }
    });
    return false;
});

В результате slideToggle отлично работает во всех браузерах, за исключением IE8, в котором будет выглядеть странное (испорченное слайд), но оно все равно будет работать.

Ответ 11

Я заметил, что toggle не работает для iphone, если вы включили jquery mobile. Если вы запустили toggle (.ready) до загрузки jquery mobile, то это будет нормально.

Ответ 12

так как вы нажимаете кнопку <a>, вам нужна функция для возврата false.

Ответ 13

Я тоже это заметил. Вероятно, вам придется переключать класс на каждый тд вместо этого. Еще не пробовал это решение, поэтому дайте мне знать!

Для других - это специфично для IE8, а не для 6 или 7.

ИЗМЕНИТЬ

Ясно, что вы не пробовали это, о чем свидетельствует -1, как я только что сделал с хорошими результатами (в моей ситуации).

CSS

tr.hideme td {display: none}

JS

$("#view-advanced").click(function() {
    $("tr.hideme td").toggle();
    return false;
});