我的tableDnD dragHandle没有限制拖动到FireFox中的一个表格单元格

时间:2014-05-30 16:03:41

标签: javascript jquery html css jquery-ui

我想我错过了一些非常简单的东西,但我遇到的问题是即使我添加了dragHandle:'。dragHandle'整个tr仍然是可拖动的。我只希望第一个td具有可拖动的功能。这是我一直在努力的例子。它与http://isocra.com/2008/02/table-drag-and-drop-jquery-plugin/

上的示例非常相似

的Javascript

$(document).ready(function () {
    $('#table-5').tableDnD({
        dragHandle: ".dragHandle"
    });

    $("#table-5 tr").hover(function () {
        $(this.cells[0]).addClass('showDragHandle');
    }, function () {
        $(this.cells[0]).removeClass('showDragHandle');
    });

});

HTML:

<div class="tableDemo">
        <table id="table-5" cellpadding="2" cellspacing="0">
            <tbody>
                <tr id="table5-row-1">
                    <td class="dragHandle"></td>
                    <td>1</td>
                    <td>One</td>
                    <td>some text</td>
                </tr>
                <tr id="table5-row-2">
                    <td class="dragHandle"></td>
                    <td>2</td>
                    <td>Two</td>
                    <td>some text</td>
                </tr>
                <tr id="table5-row-3">
                    <td class="dragHandle"></td>
                    <td>3</td>
                    <td>Three</td>
                    <td>some text</td>
                </tr>
                <tr id="table5-row-4">
                    <td class="dragHandle"></td>
                    <td>4</td>
                    <td>Four</td>
                    <td>some text</td>
                </tr>
                <tr id="table5-row-5">
                    <td class="dragHandle"></td>
                    <td>5</td>
                    <td>Five</td>
                    <td>some text</td>
                </tr>
                <tr id="table5-row-6">
                    <td class="dragHandle"></td>
                    <td>6</td>
                    <td>Six</td>
                    <td>some text</td>
                </tr>
            </tbody>
        </table>
    </div>

我使用的是最新的tableDnD版本:https://github.com/isocra/TableDnD/blob/master/js/jquery.tablednd.js

这是我正在为我的网页设计样式的CSS:https://github.com/isocra/TableDnD/blob/master/tablednd.css

这里的任何方向都会非常感激。

更新 我刚刚发现这个例子我在chrome和IE11中为我发布了作品。但是,它在Firefox中对我不起作用。所以将我的问题提炼为“在FireFox中。”

0 个答案:

没有答案