Выбрать ячейки в строке

Я хочу выбирать ячейки в таблице времени, щелкая и перетаскивая, при этом ограничение выбора происходит только в строке (скажем, в строке A), где начинается выбор - ничего не делать, если курсор перемещается из строки A, и как только он вернется в строку A, выберите ячейки между первой ячейкой и текущей ячейкой (включительно).

В настоящее время работает общий выбор (я создал jsfiddle здесь), но я не могу ограничить выбор в строке, где начинается выбор, я понял, что причина в том, что я не могу получить индекс строки и столбца в обработчиках событий, но не могу понять, почему:

    var isMouseDown = false;
    var row = -1;    // row to start a selection

    $("#our_table td")
        .mousedown(function () {
        isMouseDown = true;

        row = $(this).parent().index();    // doesn't work!!!

        return false; // prevent text selection
    })

Я нашел пример из здесь, где индекс строки/столбца можно получить в событии наведения, но когда я вставляю скрипт в свой, даже выделение не работает :(

Я новичок в этом JavaScript, буду признателен за любую помощь.


person Frank Fang    schedule 15.12.2014    source источник
comment
см. скрипт jsfiddle.net/ocu36uwk/10   -  person Anoop Joshi    schedule 15.12.2014
comment
Есть ли причина, по которой вы используете jQuery 1.3.2? Это довольно старая версия jQuery.   -  person dreyescat    schedule 15.12.2014
comment
@AnoopJoshi, твоя скрипка точно такая же, как у меня. Вы забыли нажать «Обновить», чтобы сохранить его? Спасибо, в любом случае.   -  person Frank Fang    schedule 16.12.2014
comment
@dreyescat, я бы сказал, что понятия не имел, сколько лет jQuery 1.3.2, когда я разветвил код из другой скрипки. Спасибо, что упомянули об этом.   -  person Frank Fang    schedule 16.12.2014


Ответы (2)


Если я понял вопрос:

http://jsfiddle.net/ocu36uwk/11/

используйте var $tr; для сохранения текущей строки

в функции .mousedown установить текущую строку $tr = $(this).parent();

в функции .mouseove проверьте, равны ли строки:

if (isMouseDown && ($tr[0] === $(this).parent()[0]))
person dm4web    schedule 15.12.2014
comment
dm4web и Jerodev, большое спасибо вашим ребятам, я наконец сделал это на основе ваших ответов: jsfiddle.net/ frank2048/ocu36uwk/13 - person Frank Fang; 16.12.2014
comment
В настоящее время я использую $tr[0].cells[i].className = "highlighted"; для выбора нескольких ячеек в цикле, возможно, это не очень хорошая реализация. Есть ли лучший способ использовать addClass() для этого? - person Frank Fang; 16.12.2014
comment
$($tr[0].cells[i]).addClass(выделено); - person dm4web; 16.12.2014

Вам нужно добавить элемент, из которого вы хотите получить индекс.

Эти функции должны возвращать индекс строки и столбца выбранного элемента. Сначала вы находите набор элементов, а в функции индекса указываете элемент из набора, из которого вы хотите получить индекс.

var col = $(this).parent().find("td").index($(this));
var row = $(this).parent().parent().find("tr").index($(this).parent());
person Jerodev    schedule 15.12.2014