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

function initializedrag() {
    console.log("initializedrag called")
    $(".item").draggable({
        revert:true,
        proxy:'clone',
        onStartDrag:function(){
            $(this).draggable('options').cursor = "not-allowed";
            $(this).draggable('proxy').css('z-index',3);
        },
        onStopDrag:function(){
            $(this).draggable('options').cursor="move";
        }
    });
    console.log("end of initializedrag")
}  

И я использую load для загрузки нового html сайта, который содержит div с некоторыми элементами li и тегами a, которые имеют класс .item, примерно так, когда страница готова:

$(function() {
    console.log("ready");
    $("#shop").load("shopcontent/cat1.html");
    initializedrag();

    ...
});

С помощью console.logs он вызывает функцию нормально, однако функция перетаскивания на самом деле не работает. Точно такой же draggable работает, когда у меня есть элемент, который уже находится на странице, и draggable при загрузке страницы. Однако мне нужно, чтобы он работал всякий раз, когда я вызываю функцию initializedrag.
Что здесь происходит?

davidpox

Ответы (1)

ФИКСИРОВАНО! Это было довольно просто, я просто заключил initializedrag() в функцию, которая вызывается при загрузке контента! Так что вместо:

$("#shop").load("shopcontent/cat1.html");
initializedrag();

Я так и сделал:

$("#shop").load("shopcontent/cat1.html", function() {
    initializedrag();
});

Что странно, потому что вчера я поместил содержимое initializedrag() в функцию, как указано выше, но она не сработала :)

2022 WebDevInsider