Question

我正在使用3个标签，并且悬停事件似乎没有开始。我有一些PHP确定我们是否在我们应该使用不同图像源的部分，因此PHP。就我所见，PHP正在吐出正确的SRC。

代码：

$("#tab1").hover(
  ("#tab1").attr("src","img/home_menu_images/png/home_mainmenu_hover_tab1.png"),
  ("#tab1").attr("src","PHP_SRC1"));

$("#tab2").hover(
  ("#tab2").attr("src","img/home_menu_images/png/home_mainmenu_hover_tab2.png"),
  ("#tab2").attr("src","PHP_SRC2"));

$("#tab3").hover(
  ("#tab3").attr("src","img/home_menu_images/png/home_mainmenu_hover_tab3.png"),
  ("#tab3").attr("src","PHP_SRC3"));

其中PHP_SRC(num)是围绕echo $tab_image_(num)的PHP打开和关闭标记。

Answer 1

我的第一个倾向是你错过了$函数开头的mouseover, mouseout。尝试将它们添加到：

$("#tab1").hover(
    $("#tab1").attr("src", "img/home_menu_images/png/home_mainmenu_hover_tab1.png"),
    $("#tab1").attr("src", "PHP_SRC1")
);
$("#tab2").hover(
    $("#tab2").attr("src", "img/home_menu_images/png/home_mainmenu_hover_tab2.png"),
    $("#tab2").attr("src", "PHP_SRC2")
);
$("#tab3").hover(
    $("#tab3").attr("src", "img/home_menu_images/png/home_mainmenu_hover_tab3.png"),
    $("#tab3").attr("src", "PHP_SRC3")
);

如果这不起作用，请尝试将它们包装在匿名函数中：

$("#tab1").hover(
    function () {$("#tab1").attr("src", "img/home_menu_images/png/home_mainmenu_hover_tab1.png");},
    function () {$("#tab1").attr("src", "PHP_SRC1");}
);
$("#tab2").hover(
    function () {$("#tab2").attr("src", "img/home_menu_images/png/home_mainmenu_hover_tab2.png");},
    function () {$("#tab2").attr("src", "PHP_SRC2");}
);
$("#tab3").hover(
    function () {$("#tab3").attr("src", "img/home_menu_images/png/home_mainmenu_hover_tab3.png");},
    function () {$("#tab3").attr("src", "PHP_SRC3");}
);

Answer 2

我不喜欢jquery选项卡从我自己的角度来看...有一种更简单的方法来制作标签...你添加html锚点和ul li标签，然后你就可以添加jquery点击事件。 ..在点击事件中，你创建一个$ post或$ get，然后你渲染你在div容器中的内容......这比使用这些标签控件更简单......

<ul class="menu">
  <li><a onclick="function1()" class="active">tab1</a></li>
  <li><a onclick="function2()">tab2</a></li>
</ul>

<div id="content">
</div>

<script>
  function function1() {
     $('#content').html('Loading...');
        $.get("/yourdomain/someurl1", { }, function(data) {            
            $('#content').html(data);
        });
  }

  function function2() {
     $('#content').html('Loading...');
        $.post("/yourdomain/someurl2", { id: 1}, function(data) {            
            $('#content').html(data);
        });
  }
</script>

由你决定

试图调试jquery` .hover`事件

2 个答案: