Question

是的，我有4个div，我希望1和3在点击链接时淡入，2和4在点击其他按钮时淡入。我正在使用JQuery。这是我到目前为止所得到的：

<div id="video selector" style="float: right; width: 250px; background-color:#f3f3f3; height: 210px; margin-bottom:13px;">
<a href="#">
  <script>
     $(document.body).click(function () { 
         $("#1").fadeIn("slow"); 
         $("#3").fadeIn("slow"); 
         $("#2").hide();  
         $("#4").hide();
      });
  </script>
  <img src="img/electronic recycling play.png" style="width:220px; padding-left:15px; padding-top:12px; padding-bottom:9px; cursor:pointer;" />
  </a>
  <center>Electronic Recycling</font></center>
  </div>

这个正在加载div 1和3。

<div id="video selector2" style="float: right; width: 250px; background-color:#f3f3f3; height: 210px;">
 <a href="#">
   <script>
         $(document.body).click(function () { 
            $("#2").fadeIn("slow"); 
            $("#4").fadeIn("slow"); 
            $("#1").hide();  
            $("#3").hide();
         });
    </script>
    <img src="img/battery recycling play.png" style="width:220px; padding-left:15px; padding-top:12px; padding-bottom:9px; cursor:pointer;" />
    </a><center>Battery Recycling</font></center>
  </div>

这个正在加载div 2和4。

问题是他们都加载相同的div（2和4），视频没有切换，只是重新加载相同的，你按下的枯萎按钮......任何想法？

Answer 1

为您的标记添加ID，如下所示：

  <a href="#" id="firstlink"> ... </a>

然后在文档就绪函数中添加click事件处理程序，如下所示：

  <script>
 $(document).ready(function () {
     $("#firstlink").click(function(){ 
     $("#1").fadeIn("slow"); 
     $("#3").fadeIn("slow"); 
     $("#2").hide();  
     $("#4").hide();
   });
  });
</script>

上面的代码可以放在页面的头部而不是标签的内容中。它添加了事件处理程序，以便在单击具有id firstlink的标记时执行该函数。可以为下一个链接执行类似的功能。

我正在尝试将2个内容淡入，一个选择一个链接，另一个选择另一个链接时？

1 个答案: