JQuery切换无法正常工作

我对JQuery切换有问题

我有以下代码：

var $_ = jQuery;
$_(document).ready(function(){

$_("#sh-zone-buttons").delegate("#sh-zone-button-login-menu", "click", function(event)
{
    event.stopPropagation();
    event.preventDefault();
    var elem_core = $_(this);
    $_("#sh-zone-login-menu").toggle(0, function(){

        if($_(this).is(":visible"))
        {
            $_(this).hide();
            console.log("#sh-zone-login-menu: HIDE");
        }
        else if(!($_(this).is(":visible")))
        {
            $_(this).show();
            console.log("#sh-zone-login-menu: SHOW");
        }           

    });
    elem_core.toggleClass("current");       

});

});

我正在使用脚本显示和隐藏一个DIV。但是，toggle（）似乎根本不起作用，我也不知道为什么。结果是，它只显示内容，从不隐藏。我也尝试过使用toggle（）函数，但它给出了相同的结果

我正在使用Firefox4和jQuery1.5.2

---

我非常感谢您的帮助来解决这个问题。

我想解决方案应该是添加一个

.delegate（）

。

为什么要同时使用切换隐藏和显示

只需要切换

检查这个

---

使用当前代码隐藏

#sh区域登录菜单

，然后使用回调方法使其再次可见。
另外，

var$\uquery=jQuery.noConflict（）

是将jQuery的

$

分配给变量的首选方法

var $_ = jQuery.noConflict();

$_(document).ready(function(){

  $_("#sh-zone-buttons").delegate("#sh-zone-button-login-menu", "click", function(event) {
    event.stopPropagation();
    event.preventDefault();

    $_("#sh-zone-login-menu").toggle();
    $_(this).toggleClass("current");
  });
});

我将其简化为：

var $_ = jQuery;

$_(document).ready(function() {

    $_("#sh-zone-buttons")
        .delegate("#sh-zone-button-login-menu", "click", function(event) {

        $_("#sh-zone-login-menu").toggle();
        $_(this).toggleClass("current");       
        return false;

    });

});

如果只打算使用一次，则无需定义

var elem_core

，因此只需使用

$（this）.toggleClass（“当前”）

您不需要所有隐藏/显示混乱，只需使用
toggle（）
，因为这就是它为您所做的

您不需要
event.stopPropagation（）
和
event.preventDefault（）
，只需执行
返回false
，两者都是如此。
我似乎已经解决了这个问题，但它会让我大吃一惊

下面是我想要切换的DIV的HTML代码：

<div id="sh-zone-login-menu" class="sh-zone-button-link-menu-container">
<fieldset>
    <form action="#" method="post" enctype="multipart/form-data">
        <p>
        <label for="email">Username or Email</label>
        <input type="text" name="email" maxlength="255" value="" />
        </p>
        <p>
            <label for="email">Password</label>
            <input type="password" name="password" maxlength="20" value="" />
        </p>
        <p class="remember">
            <input type="submit" value="Sign in" />
            <input type="checkbox" name="remember" value="1" />
            <label for="remember">Remember me</label>
        </p>
        <p>
            <a href="#">Forgot your password?</a>
        </p>
        </form>
</fieldset>
</div>



用户名或电子邮件


密码


记得我吗




使用上面的代码，切换不起作用

但当我取出字段集标记时，切换就起作用了。就我个人而言，我无法解释为什么会这样，但上面的代码却无法解释

我已经禁用了所有的脚本标记，除了jQuery的标记，还有所有的javascript代码，除了要切换的标记，我仍然得到相同的现象

然而，在JSFIDLE中(http://jsfiddle.net/bBXhD/2/)，我看不出有什么问题。有人遇到过这样的事情吗

无论如何，谢谢大家的回复


附加说明：06-06-2011 15:41

为了以防万一以后有人遇到类似的问题，我只是想记录下我最近在这方面的发现。问题来自CSS和HTML。虽然fieldset标记不是问题所在，但是它被删除了，因为我认为用这个标记封装表单在语义上并不准确

问题来自容器div，即class=“sh zone button link menu container”。这个容器在CSS中被特别定位为绝对容器。此外，表单在CSS中也被定位为绝对的。当这种情况发生时，JQuery toggle（）将不起作用，我不确定这是为什么。我解决这个问题的方法是从CSS中删除表单标签的位置声明

您可以在这里查看JSFIDLE上的两个示例：

a。无法使用JQuery切换（）

b。工作JQuery切换（）

干杯。
大家好，戴维马特。谢谢，但还是不行。不知道为什么我也尝试了JQuery 1.6.1，同样的问题。请提供您的HTML结构或JSFIDLE.net示例。。它在JSFIDLE上工作，但在我的页面上不工作。这里是我的脚本标签（你知道有任何脚本会干扰JQuery）：嗨，Scott。感谢您提供的干净代码建议。我做了elem_核心声明，因为我需要在前面的toggle（）中使用它。我仍然有这个问题，仍然没有工作。哦，好的。。。我没有在你的帖子中看到
toggle（）
中的
elem\u core
，但是在之后。我在你贴出的答案中看到，你让它工作了，对你来说太好了=DYeah，我以前做过elem_core的事情（不是在我的帖子中）。当我试图“减少”代码时，我把它取了出来，这样我就可以找出问题所在。谢谢