关于jQuery通过this获取this里的class??

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了关于jQuery通过this获取this里的class??相关的知识,希望对你有一定的参考价值。

我想通过事件穿一个this进去, 通过this获取到.foodInfo,该怎么做???

根据你提供的 onmouseover="foodMouseOver(this)" 判断你在 javascript 中应该有这样一个函数

function foodMouseOver(ele) ...

注意这个函数如果写在 jQuery 外面,那么在函数内你就无法使用 $ (jQuery)。
如果写在 jQuery 里面,你需要写成 window.foodMouseOver = function(ele) ...;

完整代码:

$(function()
// 这里的参数 ele 就是传过来的 this
window.foodMouseOver = function(ele)
// 变量 foodinfo 就是你要获取的 div.foodInfo
var foodinfo = $(ele).find(".foodInfo");
// 显示 foodInfo
foodinfo.show();
;
);

--------------------------------

给你一点建议,尽量分离 html,CSS,和 Javascript。也就是尽量***避免***使用
----- 内联样式:<div style="width: 200px;">
----- 内联脚本:<a onclick="doSomething();">

你的例子中可以把 onmouseover="foodMouseOver(this)" 去掉,在 jQuery 中直接写为

$(".food").on("mouseover", function()
$(this).find(".foodInfo").show();
);
参考技术A function foodMouseOver(obj)
    var foodName = $(obj).find(".foodInfo .foodName").text();
    var price = $(obj).find(".foodInfo .price").text();
    var product = $(obj).find(".foodInfo .product").text();
    //......

关于js里的this指向,函数的prototype,闭包理解

代码一:

this.number = 10
function a() {
  this.number = 20
}
a.prototype.init = () => console.log(this.number)

const test = new a() // 构造函数成一个独立新对象
test.init() // 10

解析:之所以输出10,可以把 arrow function(箭头函数) 里的 this 和 arguments 关键字,可理解为函数作用域里的变量,他访问变量沿着作用域链向上找而不是访问对象属性走原型链,代码中的init上头的作用域就是window,所以他的this指向window.

代码二:

this.number = 10
function a() {
  this.number = 20  
}
a.prototype.init = function() {
  return () => console.log(this.number) // 闭包函数
}
const test = new a()
test.init() // 20

 

NO1. this

this的指向可理解为两大类:

1:test();==test.call(window,参数);//直接调用函数,this指向window

2:obj.test(); == obj.test.call(obj,参数);//函数作为对象的方法被调用,this指向该对象

注:this指向是在被调用时分配的

以上是关于关于jQuery通过this获取this里的class??的主要内容,如果未能解决你的问题,请参考以下文章

使用长度而不是事件处理程序通过 this 获取元素

关于箭头函数里的this

关于js里的this指向,函数的prototype,闭包理解

js和jquery通过this获取html标签中的属性值

jquery获取radio值求教

jQuery 语法