我有一个我正在使用的 jquery 移动应用程序,我正在尝试打开正确的面板。它用于通知。我有一种感觉,它与 ajax 有关,并且它是为多个页面完成的。我在文档中有很多页面,我为每个“myContent”div 以及函数 toggleDiv 分配了唯一的 ID。出于某种原因,当我单击图标打开面板时,它什么也不做,如果我再次单击它,它将打开面板然后立即关闭面板。
这是我的代码,关于这是如何发生的任何线索?
<script type="text/javascript">
function toggleDiv(divId) {
$("#"+divId).toggle();
$(document).ready(function(){
$("#myContent").load("getnotes.php?name=<? echo $username; ?>");
});
}
</script>
<!-- BEGIN PAGE 1 -->
<div data-role="page" id="feed" data-add-back-btn="true">
<div data-role="panel" id="settingspanel" data-position="left" data-display="overlay">
<!--LEFT SIDE PANEL CONTENT HERE-->
</div>
<div data-role="header" data-position="fixed" data-theme="c" data-tap-toggle="false" data-id="foo1" style="padding-top: 5px; border-bottom: 1px solid #eccfb3; padding-bottom: 5px;">
<a href="#settingspanel" data-role="button" data-iconpos="notext" class="icon-reorder icon-2x" style="background: none; margin-left: 20px;"></a>
<center><img src="images/logo_app_white.png" height="25px"></center>
<!--THIS IS THE BUTTON TO PUSH TO MAKE NOTIFICATIONS APPEAR-->
<a href="#myContent" data-ajax="false" onclick="toggleDiv('myContent');" data-role="button" data-iconpos="notext" class="icon-bell-alt icon-2x" style="background: none; margin-right: 20px;"></a><? echo $number; ?>
</div>
<div data-role="content">
<!--THIS IS WHERE CONTENT FOR THE PAGE GOES-->
</div>
<div data-role="footer" data-position="fixed" data-theme="c" data-tap-toggle="false" data-id="foo1" style="border-top: 1px solid #eccfb3; padding-top: 5px;">
<div data-role="navbar" style="background: #ce8339;">
<!--ICONS FOR NAVIGATION BAR-->
</div><!-- /navbar -->
</div>
<!--HERE IS WHERE THE NOTIFICATIONS APPEAR-->
<div data-role="panel" id="myContent" data-position="right" data-display="overlay">
</div>
</div>
<!-- END PAGE 1 -->