1

私はjQueryボタン、特にこの例を使用しています：

http://jqueryui.com/button/#splitbutton

このマークアップincideテーブルtdを各行に配置しました。

<div>
    <button id="possible-actions">Action</button>
</div>
<ul>
    <li><a href="#">Reopen</a></li>
    <li><a href="#">Close</a></li>
    <li><a href="#">Delete</a></li>
    <li><a href="#">Move...</a></li>
</ul>

もちろん、それに応じてjavascriptを変更しました。ただし、現在Internet Explorer 8でのレンダリングの問題に苦労しています。何が起こっているのかというと、他のセルのコンテンツがバグでレンダリングされるということです。たとえば、行の高さが奇妙で、一部のセルのコンテンツがセルの外側にレンダリングされます。しかし、マウスを行の上に移動すると、IEが再描画/更新され、行が修正されたように見えます。

マウスオーバーハンドラーも他のイベントもありません。プレーンテーブル+このjQueryUIボタン。td内でブロック要素を使用しているため、またはページが読み込まれてブラウザでテーブルのレンダリングに問題が発生した後にこれらのボタンを動的に作成しているために、これが発生する可能性があるのではないかと思います。

参考：Google Chrome＆FFにはこの問題はありません。

4

1 に答える 1

0

マークアップを次のように変更します。

<span style="display: inline-block">
    <button id="possible-actions">Action</button>
</span>
<ul style="display: none">
    <li><a href="#">Reopen</a></li>
    <li><a href="#">Close</a></li>
    <li><a href="#">Delete</a></li>
    <li><a href="#">Move...</a></li>
</ul>

問題を修正しました。私が使用するスタイルは次のとおりです。

  • display：inline-block-幅/高さの寸法を制御する必要があるため
  • 表示：なし-ボタンがクリックされたときにオンデマンドでメニューを作成して表示するため
于 2012-12-23T11:37:52.497 に答える