显示单击单词的文本。 jQuery的

时间:2012-02-15 22:32:05

标签: jquery

您好我正在尝试从另一个jquery函数创建的<li>标记之间的单词中获取文本。

此功能在每个单词周围添加<span>个标签,点击任何单词时都应显示单击的文字。单独测试时,这种方法很好。

唯一的问题是它不起作用,因为文本是在页面加载后生成的所以我需要使这个函数.live('click' function ()等等....

我无法为我的生活获得正确的语法。

有什么建议吗?

$('li.ingredient').contents().each(function(_, node) {
var nodelist = node.textContent.split(/\s/).map(function( word ) {
    return $('<span>', {
        text: word + ' ',
        click: function() {
            alert( $(this).text() );
        }
    }).get(0);
});

$('li.ingredient').empty().append(nodelist);
});

2 个答案:

答案 0 :(得分:2)

本机Array对象没有map方法。

尝试这样的事情:

$('li.ingredient').contents().each(function(_, node) {
  // array of words
  var nodelist = $(node).text().split(/\s/);
  var str = "";
  for (var i = 0; i < nodelist.length; i++) {
    str += "<span>" + nodelist[i] + " </span>";
  }

  $('li.ingredient').html(str).find("span").click(function(){
    alert($(this).text());
  });
});

答案 1 :(得分:0)

这个例子怎么样: jsFiddle

此示例有一个列表,其中按钮添加了一些随机单词,每个单词都包含在span标记中。当您单击任何单词时,它的值将记录到控制台。

jQuery的:

$('button').click(function(){
    $('li').append('<span>foo</span> ');
});

$('li').on('click','span',function(e){
    console.log($(this).text());
});