1

SlickGrid を使用して、各行に削除ボタンを追加したいと思います。しかし、ユーザーが行の上にカーソルを置いたときにのみボタンを表示したいと思います。この効果の良い例を次に示します。

http://grooveshark.com/#/popular

「再生」ボタンと「オプション」ボタンは、行のマウスオーバーでのみ表示されます。

私が実装したソリューションは次のようになります。

  $(".slick-row").hover(
    function () {
      $(this).find(".deletelink").css({"visibility": "visible"});          
    },
    function () {
      $(this).find(".deletelink").css({ "visibility": "hidden" });
    }
  );

それは機能しますが、これを行うための最も簡単な/推奨される方法はありますか? 私は SlickGrid を初めて使用しますが、組み込みのメソッドで必要なものが得られない場合にグリッドを操作する方法がまだわかりません。

jQuery を使用して $(".slick-row") などの SlickGrid 要素を操作することは良い考えですか? または、これを行うより良い方法はありますか？

編集：私の方法に小さな問題があることを発見しました。グリッドを数画面上下にスクロールすると、トグル機能が失われます。おそらく、SlickGrid がテーブルの行を破棄して再作成しているためです。ライブイベントを使用してこれを解決できるかもしれません。繰り返しますが、これは良い解決策ですか、それともこの種の問題に取り組むためのより良い方法はありますか?

4

1 に答える 1

2

代わりにこれを使用してください

$('.slick-row').live('mouseover mouseout', function (event) {
        if (event.type == 'mouseover') {
            $(this).find(".deletelink").css({"visibility": "visible"}); 
        } else {

             $(this).find(".deletelink").css({ "visibility": "hidden" });
        }
    });

グリッドを数回上下にスクロールした後でも、ここでうまく機能します

于 2012-05-25T18:23:13.887 に答える