-3

我正在尝试向单击的 div 添加一个类它似乎没有做任何事情？这是我的jQuery

 $("#dropdown-nav").click(function () {

this.addClass('open');
    console.log('test');

});
4

5 回答 5

6

您有一个明确的问题，由以前的答案标记，还有一个潜在的问题（您对 Abinash 的评论表明，按照他的建议去做，解决了第一个问题，但不能正常工作）。

问题A：addClass是jQuery对象的一个​​方法，不是DOM元素，而是click回调内this指的是一个DOM元素。要将其包装在 jQuery 对象中，请使用$(this)或jQuery(this)（在noConflict模式下）。请参阅前面的答案。

问题 B：如果仅此一项还不能解决问题，则最有可能的是，dropdown-nav当您运行连接click处理程序的代码时，该元素还不存在。有两种方法可以确保它存在：

  1. 将script包含连接代码的标签放在HTML 文件中的元素下方。通常，最好将脚本放在最后，就在结束</body>标记之前。或者，

  2. 使用 jQuery 的ready回调。

如果这些都不能解决，其他可能的解释是：

  • 该元素没有id您认为它拥有的 ( dropdown-nav)
  • 其他东西已经钩住了该click事件并在您的代码看到它之前停止了该事件
  • （到达这里）你忘记加载 jQuery

这是一个解决这两个问题的示例，使用问题 B 的解决方案 #1：

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
  <style>
    .open {
      color: blue;
    }
  </style>
</head>
<body>
  <div id="dropdown-nav">Drop-down nav</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script>
// Note that this is BELOW the element in the HTML, so the element exists
$("#dropdown-nav").click(function() {
    $(this).addClass("open");
});
</script>
</body>
</html>

实时复制

于 2013-09-28T13:58:08.580 回答
2

你的语法this是错误的。代替

this.addClass('open');

写

$(this).addClass('open');

或者

jQuery(this).addClass('open');

使用 jquery 时使用 $ 符号或前缀 jquery

于 2013-09-28T13:48:19.167 回答
0

当您处理 jquery 时，this 应该是$(this)

 $("#dropdown-nav").click(function () {   
    $(this).addClass('open');
    console.log('test');    
});

看来，您刚刚开始使用 Jquery。

学习：http ://learn.jquery.com/javascript-101/this-keyword/

于 2013-09-28T13:44:17.853 回答
0

你错过了 $ 试试这个

$(this).addClass('open');
于 2013-09-28T13:45:32.473 回答
0

'#dropdown-nav sounds like a large element to me. Are you sure it's not something like#dropdown-nav .menu-item`？无论如何，上述所有建议听起来都值得尊重和相关。这是您可能想尝试的一件事：

$("#dropdown-nav").on('click',function (e) {
    alert('You actually clicked on ' + e.target);
    $(this).addClass('open');
    console.log('test');
});
于 2013-09-28T14:33:22.327 回答