jquery - 传递参数来改变css

Question

我不让这个工作。我想通过 changeCSS 函数解决这个问题，这样我就可以传递不同的属性和值。

$("div").on("mouseover", changeCSS("opacity","0.5"));

function changeCSS(prop,val) {
$(this).css(prop, val);
}

Answer 1

它不起作用，因为当在里面时changeCSS，this === window. 您也应该传入元素。.on()如果您想提供自定义参数，您还需要提供一个函数。

$("div").on("mouseover", function () {
    changeCSS(this, "opacity", "0.5"));
});

function changeCSS(elem, prop, val) {
    $(elem).css(prop, val);
}

您可能已经这样做了，但您可能还应该有一个 mouseleave 事件来恢复不透明度。

$("div").on("mouseleave", function () {
    changeCSS(this, "opacity", "1"));
});

Answer 2

我不相信可以那样使用鼠标悬停，只是一个功能。我假设您只希望在鼠标结束时更改 css，并在鼠标离开后更改回来.. 如果不是，您可以删除 mouseleave 功能：

$("div").bind("mouseenter",function(){
  changeCSS(this, "opacity", "0.5");
}).bind("mouseleave",function(){
  changeCSS(this, "opacity", "1");
});
function changeCSS(ele, prop,val) {
  $(ele).css(prop, val);
}

http://jsfiddle.net/x2vhN/