jQuery单击时将css类添加到链接答案

【问题标题】：jQuery Adding a css class to a link when clickedjQuery单击时将css类添加到链接
【发布时间】：2011-07-29 13:38:48
【问题描述】：

我有当前代码：

<script type="text/javascript">
$('ul.products-slideshow-thumbs li a').bind("mousedown", function(){
  $(this).toggleClass("current");
});
</script>

<ul class="products-slideshow-thumbs">
  <li><a href="#"><img src="product-slides/thumbs/1.jpg" /></a></li>
  <li><a href="#"><img src="product-slides/thumbs/2.jpg" /></a></li>
  <li><a href="#"><img src="product-slides/thumbs/3.jpg" /></a></li>
</ul>

但它无法正常工作（基本上，没有任何反应）。
有什么建议？（恐怕我对 jQuery/JavaScript 还很陌生。）谢谢！

【问题讨论】：

这里可以正常工作：jsfiddle.net/d4FMB
如果您按该顺序运行脚本，则由于 DOM 尚未准备好，它将无法工作。将所有这些 Javascript 代码移到 HTML 下方，或者尝试使用 jQuery 的 .ready 函数进行包装。

标签： jquery css class onclick onmousedown

【解决方案1】：

我复制了您的代码，它似乎对我有用。你也试过.click()jquery的方法吗？

http://jsfiddle.net/jordanlewis/X6mn5/

【讨论】：

【解决方案2】：

试试这个：

<script type="text/javascript">
 $(document).ready(function(){   
   $('ul.products-slideshow-thumbs li a').click(function(){
      $(this).toggleClass("current");
    });
  });
</script>

<ul class="products-slideshow-thumbs">
  <li><a href="#"><img src="product-slides/thumbs/1.jpg" /></a></li>
  <li><a href="#"><img src="product-slides/thumbs/2.jpg" /></a></li>
  <li><a href="#"><img src="product-slides/thumbs/3.jpg" /></a></li>
</ul>

【讨论】：

+1 我很确定问题是脚本在 HTML 元素创建之前就已经运行了。
工作就像一个魅力！还有@StriplingWarrior：你说得对，我把它放在页面中间进行测试，而不是把js放在标题标签之间。感谢您的帮助！