0

我有多个动态创建的具有相同类名的跨度元素。

<span class="btn catgry" style="margin:10px" onclick="catg()">'+result[i]+'</span>'

如何获取被点击的当前跨度元素文本。我试过这个

function catg()
{
--
var s = $(".catgry",this) .text();
--
}

但它不工作..

4

5 回答 5

2

一种选择是使用关键字传递当前元素：this

... onclick="catg(this);" ...

并在 JavaScript 中捕获它：

function catg(span) {
    ...
    var s = $(span).text();
    ...
}

另一种选择是绑定点击事件省略onclick属性：

$(document).on("click", ".btn.catgry", function() {
    ...
    var s = $(this).text();
    ...
});

在这里，您可以document使用..btn.catgry

于 2013-04-24T10:26:53.160 回答
1 
function clicked(evt) { 
    alert(evt.target.textContent);
}

for (var i = 0; i < 10; i += 1) {
    var span = document.createElement("span");

    span.className = "btn catgry";
    span.textContent = "Result" + i;
    span.addEventListener("click", clicked, false);
    document.body.appendChild(span);
}

在jsfiddle上

使用内联 javascript 被认为是不好的做法。

IEonclick="catg()"

如果您打算在动态添加跨度后使用 jquery 添加事件。然后考虑使用委托事件

当提供选择器时，事件处理程序被称为委托。当事件直接发生在绑定元素上时，不会调用处理程序，而只会调用与选择器匹配的后代（内部元素）。jQuery 将事件从事件目标冒泡到附加处理程序的元素（即，从最里面到最外面的元素），并为沿着该路径匹配选择器的任何元素运行处理程序。

function clicked(evt) { 
    alert(evt.target.textContent);
}

$(document).on("click", ".btn", clicked);

for (var i = 0; i < 10; i += 1) {
    var span = $("<span>").attr({
        "class":  "btn catgry"
    }).text("Result" + i);

    $(document.body).append(span);
}

在jsfiddle上

于 2013-04-24T10:32:01.950 回答
0

你也可以试试

var spanText = $(this).text();
于 2013-04-24T10:27:23.647 回答
0

你不要这样用

$('span.catgry').click(function(){
   //your logic
   var text = $(this).text();
});
于 2013-04-24T10:27:27.757 回答
0

如果它们是动态创建的，我建议您将跨度包装在一个包装器中，让 jquery 在 dom 准备好之后创建跨度

$('#wrapper').on('click', '.catgry', function(){
var s = $(this).text();
})
于 2013-04-24T10:33:57.020 回答