如何在jQuery点击事件中使用宽度?
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何在jQuery点击事件中使用宽度?相关的知识,希望对你有一定的参考价值。
我正在创建一个函数,每次调用它时,1px被减去图像的宽度。我无法弄明白......这样的事情:
var leafCompress = function(){
.css("width" -1 + "px"); //This line is definitely wrong
}
(以下代码正常工作)这里我添加事件监听器,所以每次单击它都会调用leafCompress函数。
leaf.on("click",function(){
leafCompress();
});
答案
问题来自你的函数leafCompress
$( "#panda" ).on('click', () => {
resize();
});
const resize = () => {
let width = $("#panda").width() - 50; // get the width of the image and substract 50
$("#panda").css("width", width);
}
#panda {
width: 400px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img id="panda" src="http://r.ddmcdn.com/w_624/s_f/o_1/cx_0/cy_17/cw_624/ch_416/APL/uploads/2014/06/red-panda-09-625x350.jpg" />
另一答案
我不确定你是否使用jQuery但是,你可以使用jQuery .width函数,css('width')函数返回宽度为字符串即:“780px”并用它来设置你通常的宽度属性做.css('width',valueToBeSet)
但是你可以使用jQuery实现相同的结果.width函数$()。width()将返回实际的宽度和$()。width(value)将宽度设置为值
另一答案
最琐碎的方式:
leaf.click(function(){
var node = $(this);
node.css('width', node.width() - 1 + 'px');
})
如果事件处理程序是一个函数,“this”指向事件目标。
以上是关于如何在jQuery点击事件中使用宽度?的主要内容,如果未能解决你的问题,请参考以下文章