jQuery函数将不使用输入变量

Question

因此，我在div上有一个按钮，当单击该按钮时，相应的页面应淡出，而另一页面则淡入（page2，该页面设置为display：none）。 我的脚本无法运行。 谁能帮我解决这个问题？

<div>
    <div id="page1">
       <button onclick="fade(page1,page2)"></button>
    </div>
    <div id="page2"></div>
</div>

<script type="text/javascript">
function fade(out_ID, in_ID){
    $("#"+out_ID).fadeOut(1000);
    $("#"+in_ID).delay(1000).fadeIn(1000);
}
</script>

Answer 1

尝试以下操作：仅需要为参数添加引号。

<button onclick="fade('page1','page2')"></button>

Answer 2

您应该重写以完全使用jquery并删除内联javascript：

<div>
    <div id="page1">
       <button id="myButton"></button>
    </div>
    <div id="page2"></div>
</div>

<script type="text/javascript">
    // wait for page to load
    $(function () {
      $('#myButton').click(function(){
         fade($('#page1'), $('#page2'));
      });
    });

    function fade(out_ID, in_ID){
        out_ID.fadeOut(1000);
        in_ID.delay(1000).fadeIn(1000);
    }
</script>

应该可以解决您的问题。