带有原型的可拖动元素

时间:2012-03-20 22:12:11

标签: javascript prototypejs element draggable scriptaculous

我正在尝试使用原型制作新的可拖动元素。第一个元素被添加并且是可拖动的,但如果我点击添加另一个元素则第二个元素不可拖动。以下是我到目前为止:

var i = 1;
function addDragElement() {
        var str = i + '.png';
        var attrs = {
            src   :  str,
            class : 'product-tag-image',
            id    : 'product-tag-image' + i,
        };
        var img = new Element('img', attrs);
        $('look-image').insert(img);

        new Draggable(img, 
            { onEnd : function(){
                alert(img.offsetTop + ", " + img.offsetLeft);
            }
        });
        i++;
}

任何想法为什么第一个会起作用但是添加的任何其他元素都不起作用?

1 个答案:

答案 0 :(得分:0)

我让这个工作。我将$('look-image').insert(img);替换为$(document.body').insert(img);

我没有方便的图像,所以我添加了一些CSS来使你的插入图像可见:

.product-tag-image {
    width:50px;
    height:50px;
    display:block;
    border:1px solid #ff0000    
}

似乎很好。你有任何JS错误吗? (我最初做的是因为我忘了包括Scriptaculous。)