javascript 单击事件上的 JQuery addClass()
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16310956/
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
JQuery addClass() on Click Event
提问by Jordan
I am attempting to build a Jquery/CSS drop down menu and things have been going pretty good so far. I'm pretty new to JQuery and I get it most of the time - however, I cannot figure out what I am doing wrong here.
我正在尝试构建一个 Jquery/CSS 下拉菜单，到目前为止一切进展顺利。我对 JQuery 还很陌生，而且大部分时间我都知道它 - 但是，我无法弄清楚我在这里做错了什么。
I am attempting to change the class of one of the drop-down tabs when it is clicked, but it doesn't appear to be working as expected.
我试图在单击时更改其中一个下拉选项卡的类，但它似乎没有按预期工作。
You can see the code I have so far over here: http://jsfiddle.net/utdream/NZJXq/
你可以在这里看到我到目前为止的代码：http: //jsfiddle.net/utdream/NZJXq/
I have the class "selected" looking how I want the button to look when a button is clicked on, but I cannot seem to make it so the "selected" class is applied on a click event. In theory, this:
我让类“selected”看起来我希望按钮在单击按钮时看起来如何，但我似乎无法做到所以“selected”类应用于单击事件。理论上，这是：
<li id="menuProducts"><a href="#" class="hasmore">Products</a>
<div id="ProductsMenu">
<ul>
<li><a href="#">Submenu Item</a></li>
<li><a href="#">Submenu Item</a></li>
</ul>
</div>
</li>
Should change this this on a click event:
应该在点击事件上改变这个：
<li id="menuProducts"><a href="#" class="selected">Products</a>
<div id="ProductsMenu">
<ul>
<li><a href="#">Submenu Item</a></li>
<li><a href="#">Submenu Item</a></li>
</ul>
</div>
</li>
And this is my current jQuery (which doesn't work):
这是我当前的 jQuery（不起作用）：
jQuery(document).ready(function () {
$('#menuProducts a:first').on('click',
function () {
$("a:first").removeClass("hasmore");
$("a:first").addClass("selected");
menuSubCloseAll.call(this, 'menuProducts');
$('#menuProducts').find('li').slideToggle(200);
});
});
I've tried rewriting this code in many,many different ways and I'm running out of ideas on what I could be doing wrong.
我试过用很多很多不同的方式重写这段代码，但我对我可能做错的地方没有任何想法。
Anyone out there have any pointers on what I could do to fix this?
任何人都对我可以做些什么来解决这个问题有任何指示？
Thank you in advance!!
先感谢您！！
采纳答案by Nelson
Do it like this:
像这样做：
jQuery(document).ready(function () {
$('#menuProducts a:first').on('click',
function () {
$(this).removeClass("hasmore");
$(this).addClass("selected");
menuSubCloseAll.call(this, 'menuProducts');
$('#menuProducts').find('li').slideToggle(200);
});
});
You were actually changing the class of the first <a>in your page, not the <a>you clicked, which you can access directly in the handler with $(this).
您实际上是在更改<a>页面中第一个的类，而不是<a>您单击的类，您可以直接在处理程序中使用$(this).
回答by ppalmeida
Did you try use "this" inside the call??
您是否尝试在通话中使用“this”？
$('#menuProducts a:first').on('click',
function () {
$(this).removeClass("hasmore");
$(this).addClass("selected");
menuSubCloseAll.call(this, 'menuProducts');
$('#menuProducts').find('li').slideToggle(200);
});
It worked for me
它对我有用
