带有`click`事件存储的jQuery元素未按要求工作

debugcn 发表于 Dev

3g网络火车

我的一位APP开发人员要求

我克隆了link3次并存储到一个对象中。在我存储到对象之后，我向存储对象的link元素添加了一些click事件。

我有一个导航链接，当用户单击导航编号时，我会将存储的元素附加到容器中。

所有的作品。问题是：

该click事件link仅对页面加载有效。将其他存储的对象改组到容器后，它不起作用。

如何解决这个问题。一切都消失了。click事件无法继续进行。

这是我的js：

var listLength = $('li').length;
var origional = $('.content');
var catcheEl = {};

    for(i=1;i<= listLength;i++){
        catcheEl['content'+i] = origional.clone();
        var link = $(catcheEl['content'+i]).find('a').addClass('link'+i);
        addEvent(link);
    }

function addEvent (link) {
    var x = 0;
    link.click(function(e){
        e.preventDefault();
        x++;
        console.log(x);
        $(this).addClass('p'+x); //only adds on page load.
    });
}

$('li').click(function(){
    var num = $(this).find('button').prop('class');
    $('#newContainer').html(catcheEl['content'+num]); //not working once other elements loaded.
});

$('.content').hide();

现场演示

我需要的是：

我应该link按一下导航按钮以重新整理元素
的班级名称element应继续
添加的事件应该继续。

提前致谢。

剃刀藻

编辑新答案
我不太喜欢它，因为它依赖于类的值（您应该进行一些安全检查，但是...基本上，我已经编辑了定义的方式x，所以我检索了a的所有类，拆分后，检查数组的长度，
然后，如果是1（仅link类）或0（不知道，以防万一），或者不是数组，则进行设置，0否则获取最后一个数组元素并删除所有非数字位（希望不知道空字节或类似的有趣人物）。

var listLength = $('li').length,
    origional = $('.content'),
    catcheEl = {};

function addEvent(link) {
    //Define the x variable
    var v=link.attr('class').split(/\s+/),
        l=v.length,
        x= (v.constructor === Array && (l==1 || l===0))? 0:parseInt(v[l-1].replace(/\D/g,''));

    link.click(function (e) {
        e.preventDefault();
        x++;
        $(this).addClass('p' + x);
    });
}

for (i = 1; i <= listLength; i++) {
    catcheEl['content' + i] = origional.clone();
    var link = $(catcheEl['content' + i]).find('a').addClass('link' + i);
    addEvent(link);
}

$('li').click(function () {
    var num = $(this).find('button').prop('class');
    $('#newContainer').html(catcheEl['content' + num]);
    addEvent($(catcheEl['content' + num]).find('a')); //Re-bind the event
});

$('.content').hide();

小提琴

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。