切换功能将不起作用

Question

我有这个 div（方块形状），我想通过点击它左右移动。这个想法是第一个切换动作有效（意味着该块从左侧占用 space 的 250px）但在我再次单击它后不会向左移动。

$(document).ready(function()
{

    $("#block1").click(function()
    {
        var toggleState = true;
        if (toggleState)
        {
            $("#block1").animate({left: '250px'});
        }
        else
        {
            $("#block1").animate({left: '250px'});
        }
        toggleState = !toggleState;
    });
});

Answer 1

需要在点击函数外定义toggleState，否则它的值会不断被覆盖。我还用空值定义了变量并更改了 true 条件左值，但这些都不是您的主要问题。

var toggleState;

$("#block1").click(function() {
    if (toggleState) {
        $("#block1").animate({
            left: '10px'
        });
    } else {
        $("#block1").animate({
            left: '250px'
        });
    }
    toggleState = !toggleState;
});

Demo

Answer 2

函数内部有 toggleState 变量，需要将其移到外部。

切换功能将不起作用

Toggle function won't work

jquery

toggle