jquery动态点击事件

时间:2013-05-13 15:26:59

标签: javascript jquery

我的一些代码使用jquery创建元素<a>,其中包含针对点击行为的函数:

$(alternatives).each(function (idx, elt) {
  var element = $('<span class="label label-success">');
  var link = $('<a class="prop' + idx + '" title="' + elt + '">' + elt + '</a>');
  link.click(switchLabel);
  element.append(link);
  list.append(element);
});

这里的想法是抓住<a class="prop1-0" title="myTitle">my link</a>上的点击事件来更改<span id="corr1-0">my old text</span>中的文字。两个元素之间的链接由类后缀f.i构成。 1-0

我有几对<a>/<span>,我检查了每个ID。

有些链接可以正常工作,但有些链接不起作用:控制台中没有错误,无法用萤火虫跟踪......

绑定的功能是:

function switchLabel(e) {
  $('#corr'+ e.target.className.substr(4)).text($(e.target).attr('title'));
}

您是否有一些提示可以帮助我跟踪这种不受欢迎的行为? 我可以在实施中犯错吗?

此致

1 个答案:

答案 0 :(得分:4)

您的变量不匹配,您使用索引而不是idx等,并且有更简单的方法来创建元素和事件处理程序?

$.each(alternatives, function (idx, elt) {
    var element = $('<span />', {'class' : 'label label-success',
                                 id      : 'corr'+idx
                                }
        ),
        link    = $('<a />' {id    : 'prop' + idx, 
                             title : elt, 
                             text  : elt
                            }
        );
    link.on('click', function() {
        $('#' + this.id.replace('prop','corr')).text(this.title);
    });
    list.append( element.append(link) );
});