14

フィドル

$(document).live('mouseup', function () {
    flag = false;
});

var colIndex;
var lastRow;

$(document).on('mousedown', '.csstablelisttd', function (e) {
    //This line gets the index of the first clicked row.
    lastRow = $(this).closest("tr")[0].rowIndex;

    var rowIndex = $(this).closest("tr").index();
    colIndex = $(e.target).closest('td').index();
    $(".csstdhighlight").removeClass("csstdhighlight");
    if (colIndex == 0 || colIndex == 1) //)0 FOR FULL TIME CELL AND 1 FOR TIME SLOT CELL. 
    return;
    if ($('#contentPlaceHolderMain_tableAppointment tr').eq(rowIndex).find('td').eq(colIndex).hasClass('csstdred') == false) {
        $('#contentPlaceHolderMain_tableAppointment tr').eq(rowIndex).find('td').eq(colIndex).addClass('csstdhighlight');

        flag = true;
        return false;
    }
});

私は表のセルをドラッグしています。ドラッグしている間(下方向に移動)、テーブルスクロールも移動する必要があります。また、セルを逆に選択したい(上方向)。私は何をすべきか。

私はtrクラスを選択しました。

4

3 に答える 3

3

return false;中身を取り出してみる

$('#contentPlaceHolderMain_tableAppointment tr').eq(rowIndex).find('td').eq(colIndex).addClass('csstdhighlight');
    flag = true;
    return false; //Remove this line
} 

return false;ブラウザーのデフォルトの動作を停止するため(自動的にスクロールします)。

デモ

于 2013-07-18T13:59:16.953 に答える
3

あなたのテーブルにはいくつか問題がありますが、あなたが求めていたものを修正します。
マウスがコンテナーの外に出たときにテーブルをスクロールするには、mousedownイベント ハンドラー内に次のコードを追加します。

$('body').on('mousemove', function(e){
    div = $('#divScroll');      
    if(e.pageY > div.height() && (e.pageY - div.height()) > div.scrollTop()) {
        div.scrollTop(e.pageY - div.height());
    }
});

そしてこれは、あなたのmouseupイベントハンドラーの中で:

$('body').off('mousemove');

更新された Fiddleを参照してください

しかし今、別の問題が発生しています。これは、コードの残りの部分が原因です。マウスが列から離れたため、行は選択されていません。

于 2013-07-18T13:30:41.343 に答える