Javascript jQuery show（）和hide（）不起作用

我正在把老问题推到左边，把新问题推到右边。您可以看到我在这个JSFIDLE中所做的工作：

但是，当我在JSFIDLE之外工作时，主要是因为它无法从GitHub正确加载roundound.js文件，所以我似乎无法让show和hide正常工作。我有完全相同的代码，其中引用了roundout.js未注释，它将完全忽略第一个hide和show引用，然后跳过下一个hide命令并显示下一个问题

你知道为什么它不会在点击事件中触发隐藏和显示功能吗

编辑：使用最新的JSFIDLE进行编辑。它在那里工作，但不在该环境之外。

将事件绑定到DOM就绪事件中

如果您在JSFIDLE中检查源代码，就会看到DOM就绪事件中包含的所有代码。所以看起来它在这里工作，而不是在你的本地版本上

$(document).ready(function () {
    //$('ul').roundabout();
    $("#question2").hide();
    $("#question3").hide();

    var x = 1;
    $("input[type='radio']").change(function () {
        var selection = $(this).val();
        //alert("Radio button selection changed. Selected: " + selection);
        $("#question" + x).hide("slide", {
            direction: "left"
        }, 800);
        x++;
        $("#question" + x).show("slide", {
            direction: "right"
        }, 800);
    });

});

将事件绑定到DOM就绪事件中

如果您在JSFIDLE中检查源代码，就会看到DOM就绪事件中包含的所有代码。所以看起来它在这里工作，而不是在你的本地版本上

$(document).ready(function () {
    //$('ul').roundabout();
    $("#question2").hide();
    $("#question3").hide();

    var x = 1;
    $("input[type='radio']").change(function () {
        var selection = $(this).val();
        //alert("Radio button selection changed. Selected: " + selection);
        $("#question" + x).hide("slide", {
            direction: "left"
        }, 800);
        x++;
        $("#question" + x).show("slide", {
            direction: "right"
        }, 800);
    });

});

---

这种方法不使用jQueryUI，也不同于您的方法，但您仍然会得到相同的最终结果。注意，HTML/CSS在这种方法中也是不同的

工作示例：

---

这种方法不使用jQueryUI，也不同于您的方法，但您仍然会得到相同的最终结果。注意，HTML/CSS在这种方法中也是不同的

工作示例：

---

很抱歉，这不是最新保存的JSFIDLE版本。我已经将它移到了document ready函数中，但它仍然不起作用。很抱歉，它不是最新保存的JSFIDLE版本。我已经将它移到了documentready函数中，但它仍然不起作用。不久前意识到了这个错误，但即使在DOM就绪的环境下，它仍然不起作用。前一段时间意识到这个错误，但即使在DOM就绪的情况下，它仍然不起作用。这似乎适用于第一个问题，但第三个问题从未出现，它只是停留在第二个问题上。这似乎适用于第一个问题，但第三个问题从未出现，它只是停留在第二个问题上。

$(document).ready(function () {

    var x = 1,
        distance = $('.container').width(),
        qNumber  = $('.question').length;

    $('.questionList').width(distance*qNumber);

    $("input[type='radio']").change(function () {

        alert( "Radio button selection changed. Selected: " + $(this).val() );
        $('.questionList').animate({'margin-left':'-='+distance+'px'}, 500);

    });

});