Событие JQuery «Обновить» при включении - PullRequest
Новая
       13

Событие JQuery «Обновить» при включении

0 голосов
/ 17 февраля 2012

У меня есть этот скрипт, который генерирует 50 тегов 'a' для keyup: 

$("#searchbox").live("keyup",function(){
    var count = 50;
    var aElements = "";

    for (var i = 0; i < count; i++) {
        aElements += "<a href=\"#\">" + i + "</a>";
    }

    $("#page").append(aElements);
});

Проблема в том, что количество рекламы увеличивается на каждом keyup.Таким образом, вместо стрельбы по событию на определенную сумму в 50, код рекламирует счет.Таким образом, для каждого «ключа» я получаю 50 + 50 + 50 тегов «а» и так далее.Поэтому, когда я набираю «stackoverflow», я получаю 650 тегов «a» :) вместо 50. Так как мне это сделать?Пожалуйста, имейте в виду, что число на самом деле является переменной, которая меняется каждый раз, поэтому добавление события .one () не будет работать.

Ответы [ 3 ]

1 голос
/ 17 февраля 2012

Я не уверен на 100%, что понимаю ваши требования, но я верю, что это то, что вы ищете:

Вариант 1 

$("#page").html(""); //Clear HTML from #page

Вариант 2 

$("#page a").remove(); //Clear only the anchor tags from #page

Вариант 3

Просто замените .append() на .html(). Если у вас нет особых причин использовать .append(), это лучший вариант. 

$("#page").html(aElements);

Вот рабочая скрипка .

1 голос
/ 17 февраля 2012

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

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

aElements += "<a href=\"#\" class=\"number\">" + i + "</a>";

, а затем выполните следующие действия, чтобы узнать, сколько уже существует: 

var existing = $(".number").length

Затем, если число меньше того, сколько я хочу иметь: 

for (var i = existing; i < count; i++) {
    // add more

И если оно больше, выполните следующие действия, чтобы удалить лишнее: 

$(".number").gt(count).remove();
1 голос
/ 17 февраля 2012

Не используйте .append(), который, как следует из названия, добавляет новые элементы, но не удаляет предыдущие.Добавьте контейнер в конце #page и используйте .html(), чтобы удалить старый контент.

...