2012-03-07 2 views
0

У меня проблема при удалении строк из таблицы.
Это код JS, который я использую, если это поможет.При удалении строк из таблицы оставшиеся строки перемещаются вверх/вниз

function rem(el) { 
    while (el.nodeName !== "TR") { 
     el = el.parentNode; 
    } 
    el.parentNode.removeChild(el); 
} 

таблица построена так:

<tr> 
    <td> 
    <span onclick="rem(this);"></span> 
    </td> 
</tr> 

Проблема возникает, когда таблица превышает высоту браузера и появляется полоса прокрутки.

  • Если полоса прокрутки находится на вершине, и я удалить строку, остальные строки будет течь вверх.

  • Если полоса прокрутки находится внизу, и я удаляю строку, остальные строки будут стекать вниз.

  • Но если полоса прокрутки находится в середине таблицы, и я удалить строку, остальные строки будут течь вверх до тех пор, пока полоса прокрутки попадает в нижнюю экрана. Затем строки начнут течь вниз. Я хотел бы таблицы либо поток вверх или вниз. Не имеет значения , каким образом он остается неизменным.

Поскольку я удаляю строку, нажимая на нее, поток таблицы должен оставаться неизменным. Если оставшиеся строки перемещаются по-разному, пользователю сложно предсказать, какая следующая строка будет следующей, или следующей ниже.

Мой вопрос, конечно, «Как установить, как остальные строки будут течь после удаления строки?»

Сообщите мне, если мне нужно будет объяснить проблему дальше.

+0

Я думаю, вам нужно управлять полосой прокрутки, проверьте это: http://stackoverflow.com/questions/635706/how-to-scroll-to-an-element-inside-a-div –

+0

Что вы описываете звучит довольно похоже на обычное поведение браузера, но может быть, я не понимаю, что вы подразумеваете под «текущим» и «текущим». – fayerth

+0

@fayerth - Хм, подумайте об этом, возможно, вы правы. – Niklas

ответ

1

this is natural behavior с:

  • если вы до верхней (полосы прокрутки в верхней части), удалить элемент и строки сдвигаются вверх.

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

  • , если вы находитесь в середина, естественно удаляет элементы и сдвигает вещи вверх (как в случае 1), и если вы хотите больше сдвинуться, применим случай 2.

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

также, чтобы не беспокоить пользователя с большим количеством данных и не знал, что будет дальше, я предлагаю вам использовать что-то вроде удаления fade-remove или slideup-remove, поэтому процесс удаления не резкий (и пользователь может понять, что что-то удалено и заняло его место). В jQueryUI есть много этих эффектов удаления.

+0

Я собираюсь попробовать что-то, но это должно быть откат, если он не работает. Благодарю. – Niklas

1

На самом деле это не имеет никакого отношения к поведению страницы, и все зависит от того, как прокручивается браузер.

Добавление пространства внизу, которое составляет, по меньшей мере, высоту страницы вашего браузера, должно сделать трюк.

В большинстве браузеров просто добавив в нижней части страницы будет работать:

<div style='height:100%'>&nbsp;</div> 
Смежные вопросы