onClick事件将不会工作，直到页面重新加载

Question

下面的代码片段，其中包括一个onClick事件 不工作，直到我点击在模拟器和手机上重新加载。 代码位于应用程序模型文件夹的.erb文件中。

<section id="page1" data-role="page"> 
<header data-role="header"> 
    <h1>CSS 3 Animations</h1> 
</header> 
<div data-role="content" class="content"> 
    <p class="show-menu" onclick="ToggleText()">(Show/Hide) Menu</p> 

    <div class="sliding-menu slide out">Menu</div> 
</div> 
</section> 

<script type="text/javascript"> 
    function ToggleText() { 
     $(".sliding-menu").toggleClass("reverse out in"); 
    } 
</script> 

我正在使用rhomobile 3.2.1。有人可以解释为什么和怎么做 修复它？

Answer 1

会这样的工作？

• http://jsfiddle.net/aJshm/3/

JS

$('.toggle-menu').click(function() { 
    $(".sliding-menu").toggleClass("reverse out in"); 
}); 

HTML

<section id="page1" data-role="page"> 
    <header data-role="header"> 
     <h1>CSS 3 Animations</h1> 
    </header> 
    <div data-role="content" class="content"> 
     <p class="toggle-menu">(Show/Hide) Menu</p> 

     <div class="sliding-menu slide out">Menu</div> 
    </div> 
</section> 

Answer 2

只是一个猜测，尝试定义函数被调用之前呢？

Answer 3

参见后：post

我已经回答了那里，并尝试使用该方法调用函数，已经解决了我的问题刷新。