我可以在不使用'this'的情况下重写Javascript吗？

Question

我是JS的新手，我无法让它工作。

这是我的代码

jQuery('ul.menu li').each(function() {
jQuery(this).removeClass('current-menu-item');
jQuery(this).removeClass('current_page_item');
});
jQuery(this).parents('li').addClass('current_page_item');
jQuery(this).parents('li').addClass('current-menu-item');

现在， 应该做的是从导航菜单上的一个链接中删除突出显示的内容，并突出显示被单击的内容（我有一个AJAX实现）。

由于某种原因，它什么也没做。 我有一种感觉，这是由于“ this”导致了另一种结构化代码的方式，因此我可以算出代码是否错误（我不认为这是错误的）还是“ this”导致的？

编辑：

抱歉，我没有提供足够的信息。 我正在使用Twenty Fourteen wordpress主题，但我正在使用AJAX服务这些页面。

http://twentyfourteendemo.wordpress.com/

我有全局应用的代码（我在同一个地方有其他代码切换导航一旦点击（在移动设备上），并且工作正常）

我在顶部有菜单（没有任何下拉菜单，只有链接）。 我不能给出一个链接，因为它目前不是外部的。 我的代码应该努力改变这个吗？

正如一些人评论“这是什么'这个'”我觉得我完全错过了一些东西。

Answer 1

你不需要循环每个项目来逐个删除类，这更容易：

jQuery('ul.menu li').removeClass('current-menu-item').removeClass('current_page_item');

或者（它是一样的）：

jQuery('ul.menu li').removeClass('current-menu-item current_page_item');

但我不明白这是什么'这个'：

jQuery(this).parents('li').addClass('current_page_item');
jQuery(this).parents('li').addClass('current-menu-item');

你的意思是 ：

jQuery('ul.menu li').addClass('current_page_item current-menu-item');

或者，如果您正在使用事件监听器（例如点击，如@Daniel Sanchez对评论的感觉），您只需要：

jQuery('ul.menu li').click(function(){   
  // Remove class on each item  
  jQuery('ul.menu li').removeClass('current-menu-item current_page_item');

  // Add class for this one    
  jQuery(this).addClass('current_page_item current-menu-item'); 
})

Answer 2

尚不清楚您要做什么，但是可以对代码进行一些简化：

jQuery("ul.menu li a").click(function(){
    jQuery('ul.menu li').removeClass('current-menu-item current_page_item');
    jQuery(this).parent('li').addClass('current_page_item current-menu-item');
});

http://jsfiddle.net/re3hjzyf/

Answer 3

是的，通过更换this与'ul.menu li' 。

所以代码就是这样的

jQuery('ul.menu li').each(function() {
   jQuery('ul.menu li').removeClass('current-menu-item')
                       .removeClass('current_page_item');
});
// not sure what the following code is referencing too
// it is outside the bounds of .each() function.
jQuery(this).parents('li').addClass('current_page_item');
jQuery(this).parents('li').addClass('current-menu-item');

是什么this

在使用JavaScript和许多面向对象的编程语言时， this关键字用于引用程序员正在使用的当前上下文。 您当前正在引用ul.menu li元素，因此通过使用this可以调用.each()函数中选定的元素。

您可以使用在each()函数中使用的元素选择器替换它。

Answer 4

jQuery('.current-menu-item').removeClass('current-menu-item');
jQuery('.current_page_item').removeClass('current_page_item');

在这里，我假设只有一个项目将具有这些类，因为它将表示当前选择了哪个菜单项目。 最好的选择方法是搜索要删除的类。 （如果这些类总是一起使用，您也可以在同一行上将它们都删除，尽管那样的话，您可能要考虑是否确实需要两者。

jQuery('ul.menu li').on("click", function() {
jQuery(this).addClass('current_page_item').addClass('current-menu-item');
}

当“this”有一个值时，你只能使用“this”作为选择器的参数（即：在每个循环内部或内部开启。在这种情况下，我使用on（）函数来应用添加类的函数到点击的任何列表项。

合并两者，您将最终得到：

jQuery('ul.menu li').on("click", function() {
    jQuery('.current-menu-item').removeClass('current-menu-item');
    jQuery('.current_page_item').removeClass('current_page_item');
    jQuery(this).addClass('current_page_item').addClass('current-menu-item');
}