8

私のコードでこの問題が発生しているため、このコードはie9をクラッシュさせます..任意の回避策をいただければ幸いです..これはieの以前のバージョンの問題ではありません..ありがとう..

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head></head>
    <body>
        <table style="border-collapse: collapse">
            <tr id="firsttr">
                <td colspan="2"></td>
                <td></td>
            </tr>
            <tr id="secondtr">
                <td></td>
                <td style="border: 1px solid #D2D2D2">Move cursor here</td>
                <td></td>
            </tr>
        </table>
    </body>
    <style type="text/css">
        #secondtr:hover {
            display: none;
        }

    </style>
</html>

onclickイベントを使用してもブラウザがクラッシュします..次のことを試してください..カーソルをここに移動してください

    <script type="text/javascript">
    function HideThis()
    {
        document.getElementById('secondtr').style.display = 'none';
    }
</script>
4

4 に答える 4

6

私は同じ問題を抱えており、解決策を見つけました。まず第一に、問題は、IE9で(インラインで宣言されているかヘッドで宣言されているかに関係なく)collapseに等しいスタイルborderCollapseを持つテーブルのすべての行で実際に発生していると言わなければなりません。

私の解決策:

function hideRow(tableNode, rowNode, hide){
    if(hide){
        if(window.navigator.userAgent.search('MSIE 9.0') != -1){
            var initValue = tableNode.style.borderCollapse;
            tableNode.style.borderCollapse = 'separate';
            rowNode.style.display = 'none';
            tableNode.style.borderCollapse = initValue;
        }else{
            rowNode.style.display = 'none';
        }
    }else{
        rowNode.style.display = '';
    }
}

またはさらに短くする:

function hideRow(tableNode, rowNode, hide){
    var initValue = tableNode.style.borderCollapse;
    tableNode.style.borderCollapse = 'separate';
    rowNode.style.display = hide ? 'none' : '';
    tableNode.style.borderCollapse = initValue;
}
于 2012-09-25T13:06:04.833 に答える
4

IE9にはバグがありますが、cssルールは論理的に決定不可能です。

表示されなくなるとすぐに、マウスはホバリングしなくなるため、再び表示される必要があります。これは、マウスがその上にあることを意味します。つまり、非表示にする必要があります...つまり、表示する必要があります...など。

別の言い方をすれば、仕様は意味がありません。

そうは言っても、次のコードもIE9をクラッシュさせるので、このバグは本当に厄介です。

$(window).ready(function(){
    $('#secondtr').mouseenter(function(){
         $('#secondtr').hide();
    });
});

spanただし、イベントハンドラーを(たとえば)に配置した場合は発生しません。trしたがって、ホバリング検出が行われている場所が隠れないように、HTMLを変更することをお勧めします。

于 2012-07-04T09:59:41.157 に答える
1

これはIE9のバグのようです。

に変更display:noneするとvisibility:hidden、テキストが継続的に点滅します。

私が考えることができる唯一の考えは、IEが無限ループまたはスタックオーバーフローでスタックすることです。

申し訳ありませんが、解決策を提供することはできません。

于 2012-07-04T10:14:59.927 に答える
0

TR を非表示にしたい場合は、次のようなものを試すことができます。

#secondtr:hover {
  height: 0px;
  padding: 0px;
  margin: 0px;
  border: 0px;
  font-size: 0px;
}

IE 、 FF 、および Safari で機能した完全なコードは次のとおりです。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<TITLE> BLAH</TITLE>
<style type="text/css">
#secondtr:hover, #secondtr:hover .secondTD  {
    height: 0px;
    padding: 0px;
    margin: 0px;
    border: 0px;
    font-size: 0px;
}
.secondTD{
    border: 1px solid #D2D2D2;
}

</style>
</head>
<body>
<table style="border-collapse: collapse">
    <tr id="firsttr">
        <td colspan="2"> </td>
        <td></td>
    </tr>
    <tr id="secondtr">
        <td></td>
        <td  class="secondTD">Move cursor here</td>
        <td></td>
    </tr>
</table>
</body>
</html>
于 2012-07-04T11:19:50.527 に答える