单击某个元素后调用jQuery函数答案

【问题标题】：Calling jQuery function after click on some element单击某个元素后调用jQuery函数
【发布时间】：2013-07-03 04:33:24
【问题描述】：

这是 HTML 代码

<p onclick='javascript:func(this);'>Bla bla bla</p>

这里是脚本（写在文档的开头）。

function func(e) {
  var t = e.text();
  console.log(t);
}

它不起作用，我不明白为什么。错误消息是“Object # has no method 'text'”。

【问题讨论】：

【解决方案1】：

将其包装在 jQuery 包装器中。 .text() 是一个 jQuery 方法，而你的元素 e 是一个普通的 Javascript DOM 元素，所以你需要 jQuery 包装器。

var t = $(e).text();

旁注：不显眼的事件处理程序分配优于内联处理程序。例如：

$(document).ready(function(){
    $('p').click(function(){
        var t = $(this).text();
        console.log(t);
    });
});

上面使用 jQuery 来分配点击处理程序（而不是内联 Javascript），因此，对于纯 Javascript 对象，可以在 this 中访问该元素，对于 jQuery 对象，可以在 $(this) 中访问该元素。

【讨论】：

【解决方案2】：

Fiddle

这是普通的 javascript，可以满足您的要求。

function func(e) {
  var t = e.innerHTML;
  console.log(t);
}

【讨论】：

【解决方案3】：

如果您不使用 jquery，请使用 innerText。

function func(e) {
  var t = e.innerText;
  console.log(t);
}

【讨论】：

【解决方案4】：

正确的方法是：

HTML：

<p onclick='func(this);'>Bla bla bla</p>

而不是

<p onclick='javascript:func(this);'>Bla bla bla</p>

Javascript：

function func(e) {
    var t = e.innerHTML;
    console.log(t);
}

【讨论】：

【解决方案5】：

Jquery 被设计成不显眼的。如果您在任何地方添加 onclick 属性，您就做错了。

您应该添加事件侦听器

<p>Blah Blah Blah</p>

jQuery/脚本

$(document).ready(function(){
    $('p').on('click', function(){
        console.log($(this).text());
    });
});

【讨论】：

【解决方案6】：

尝试使用innerHTML：

function func(e) {
    var t= e.innerHTML;
    console.log(t);
}

【讨论】：