Беда с JQuery добавить и препенд

Question

Я использую следующий код, чтобы проверить, существует ли определенный div. И если это не так, он добавляет его в дом в нужном месте.

if (!($("#col"+lastSlide).length))
{
    $('#schDisplay').prepend('<div id="col' + (lastSlide) + '"></div>');
}

Моя проблема заключается в том, что когда оператор if снова проверяет div, который уже был добавлен / добавлен, он не видит добавленный мной div. Так что он продолжит добавлять div, который уже был добавлен / добавлен.

Есть ли способ исправить эту проблему?

больше код:

//fillin added column
function fillElement(colnum)
{
    var URL = 'schedule.php';
    $("#col"+colnum).text("Loading...").show();
    $.post(URL,{fecolnum: colnum}, 
    function (data)
    {
        $("#col"+colnum).html(data).show();
    });
}
//...irrelevant code...

    // Create event listeners for .arrows clicks
      $('.arrows')
        .bind('click', function(){
            numberOfSlides++;
            // Determine new position
            if ($(this).attr('id')=='arrow_right')
            {
                lastSlide++;
                currentPosition++;
                if (!($("#col"+lastSlide).length))
                {
                    $('#schDisplay').append('<div id="col' + lastSlide + '" class="schColumn" style="float: left; width: ' +slideWidth+ 'px"></div>');
                    fillElement(lastSlide);
                }
            }
            else
            {
                lastSlide--;
                currentPosition--;
                if (!($("#col"+lastSlide-2).length))
                {
                    $('#schDisplay').prepend('<div id="col' + (lastSlide-2) + '" class="schColumn" style="float: left; width: ' +slideWidth+ 'px"></div>');
                    fillElement(lastSlide-2);
                }
            }

Answer 1

У меня не так много контекста, но зацените это jsfiddle Я сделал из того, что вы мне дали.

Обратите внимание на строку, где я сделал комментарий, который вы можете прокомментировать из оператора приращения. По сути, это то, как вы можете проверить, что происходит, когда «lastSlide» имеет то же значение. (по сравнению с последним значением lastSlide).

Вы можете просто попробовать отладить ваш реальный код и убедиться, что lastSlide имеет значение, которое вы на самом деле ожидаете.

Answer 2

Если я правильно понимаю ваш вопрос, вы говорите, что он продолжает добавлять div, если вы делаете то же самое снова. Однако я не могу воспроизвести это. Следующий код показывает один div. По вашему мнению, было бы два деления.

lastSlide = 1;
if (!($("#col"+lastSlide).length))
{
    $('#schDisplay').prepend('<div id="col' + (lastSlide) + '"></div>');
}
if (!($("#col"+lastSlide).length))
{
    $('#schDisplay').prepend('<div id="col' + (lastSlide) + '"></div>');
}

Если я что-то не пропустил, твоя проблема должна быть в другом месте.

Answer 3

Вы можете использовать фильтры jQuery для удаления выбранного элемента div, если к нему уже был добавлен префикс.Это должно работать для вашего конкретного сценария:

$('#schDisplay').filter(':not(:has(div[id^=col]))')

Это говорит "выберите div с идентификатором 'schDisplay' и затем удалите его из выбора, если у него есть какие-либо потомки div с идентификаторами, начинающимися с 'col'".

В вашем примере вы должны связать оператор prepend с этим кодом следующим образом (нет необходимости в операторе if):

$('#schDisplay').filter(':not(:has(div[id^=col]))').prepend('<div id="col' + (lastSlide) + '"></div>');

Специальное примечание: я считаю, что: hasСелектор - это селектор фильтра содержимого jQuery, что означает, что он не будет работать без jQuery.Вы явно используете jQuery, но читатели с разными реализациями должны помнить об этом.

Answer 4

Он продолжает добавляться, потому что ваше условие if всегда истинно.

Хотя я не проверял это ...

Можете ли вы попробовать что-то подобное, чтобы увидеть, помогает ли это?

var len = 0;
len = $("#col"+lastSlide).length;
if (len < 1)
{
    $('#schDisplay').prepend('<div id="col' + (lastSlide) + '"></div>');
}

Answer 5

Это будет работать:

if (!($("#col"+lastSlide).length)) {
  var newdiv = $('<div id="col'+lastSlide+'"/>');
  $('#schDisplay').prepend(newdiv);
}