jQuery 在JQuery中,如何将被点击的元素传递给onclick事件调用的方法
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7519815/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
In JQuery, how to pass the element that was clicked to the method that is called on onclick event
提问by Barka
I have several of these lines on a page:
我在页面上有几行:
<div class="save-button" onclick="Save()">Save</div>
In my Save()
method I want to manipulate the div that was clicked to call the Save()
method. How do I pass that in (I think $(this)
), without resorting to ids?
在我的Save()
方法中,我想操纵被单击以调用该Save()
方法的 div 。我如何在(我认为$(this)
)中传递它 ,而无需求助于 ids?
Many thanks!
非常感谢!
回答by Kalle H. V?ravas
Either remove the save()
and use click()
to catch the event:
删除save()
并使用click()
来捕获事件:
<div class="save-button">Save</div>
<script>
$('.save-button').click(function () {
// Now the div itself as an object is $(this)
$(this).text('Saved').css('background', 'yellow');
});
</script>
[ View output]
[查看输出]
Or if you insists on using such function as save()
:
或者,如果您坚持使用以下功能save()
:
<div onClick="save(this)">Save</div>
<script>
$(function () {
save = function (elm) {
// Now the object is $(elm)
$(elm).text('Saved').css('background', 'yellow');
};
});
</script>
[ View output]
[查看输出]
EDIT (2015):.on('click', function)
编辑 (2015): .on('click', function)
<div class="save-button">Save</div>
<script>
$('.save-button').on('click', function () {
// Now the div itself as an object is $(this)
$(this).text('Saved').css('background', 'yellow');
});
</script>
回答by Felix Kling
Inside the event handler, this
refers to the clicked element. However, inside the function you call from the event handler, which is Save
, this
will refer to window.
在事件处理程序中,this
指的是被点击的元素。但是,在您从事件处理程序调用的函数内部,也就是Save
,this
将引用 window。
You can explicitly set what this
should refer to inside Save
via call
[MDN](or apply
):
您可以通过[MDN](或)显式设置this
应在内部引用的内容:Save
call
apply
onclick="Save.call(this, event || window.event);"
then you can use it inside the function as $(this)
:
那么你可以在函数内部使用它$(this)
:
function Save(event) {
// `this` refers to the clicked element
// `$(this)` is a jQuery object
// `event` is the Event object
};
Butas you are using jQuery, you really should do
但是当您使用 jQuery 时,您确实应该这样做
$('.save-button').click(Save);
to bind the event handler. Mixing markup with logic is not a good style. You should separate the presentation from the application logic.
绑定事件处理程序。将标记与逻辑混合不是一种好的风格。您应该将演示文稿与应用程序逻辑分开。
Orif you want Save
to accept an element as parameter, then just pass it:
或者,如果您想Save
接受一个元素作为参数,则只需传递它:
onclick="Save(this);"
and with jQuery:
并使用 jQuery:
$('.save-button').click(function() {
Save(this);
});
回答by yoozer8
Simply refer to it as: $(this)
简单地将其称为: $(this)
回答by Gabe
Pretty straight forward...
很直接...
$('#myDiv').click(function(){
save($(this));
})
function save($obj){
$obj.css('border', '1px solid red');
}
回答by Kyle Trauberman
Inside the You can convert this to a jQuery object with Save()
function this
refers to the DOM element that was clicked.$(this)
.
您可以将其转换为 jQuery 对象Save()
函数内部this
指的是被点击的 DOM 元素。$(this)
。
This refers to window
by default however, so you'll need to pass this
as a parameter of the Save function:
window
但是,默认情况下这是指,因此您需要将其this
作为 Save 函数的参数传递:
<div class="save-button" onclick="Save(this)">Save</div>
function Save(div) { }
now inside Save, you can use div
to refer to the div that was clicked.
现在在 Save 中,您可以使用div
来引用被单击的 div。
I was confused about how this
behaved. This link helped me: http://www.quirksmode.org/js/this.html
我对this
表现如何感到困惑。这个链接对我有帮助:http: //www.quirksmode.org/js/this.html