У меня есть мобильное приложение jquery, которое я использую, и я пытаюсь открыть нужную панель. Это для уведомлений. У меня такое чувство, что это связано с ajax, и это делается для нескольких страниц. У меня много страниц в документе, и я назначил уникальный идентификатор для каждого div «myContent», а также для функции toggleDiv. По какой-то причине, когда я нажимаю на значок, чтобы открыть панель, он ничего не делает, и если я снова щелкну по нему, он откроет панель, а затем немедленно закроет панель.

Вот мой код, есть какие-нибудь подсказки, как это происходит?

<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 -->
0
user2362601 6 Сен 2013 в 20:47
Журнал консоли? Есть ли там что-нибудь полезное? Не могли бы вы предоставить jsfiddle или jsbin?
 – 
Alkis Kalogeris
7 Сен 2013 в 00:23
Jsfiddle не работает. Я могу сказать вам, что когда я удаляю код javascript, который получает уведомления, панель работает нормально.
 – 
user2362601
7 Сен 2013 в 00:39
Также, когда я нажимаю на нее в первый раз, ничего не происходит, но когда я нажимаю ее второй раз, кажется, что панель закрывается. Таким образом, он никогда не показывает, что он открывается / открывается, а просто закрывается.
 – 
user2362601
7 Сен 2013 в 00:39

1 ответ

Лучший ответ

Подготовьте свой документ вне функции. И переключатель (), чтобы показать ().

Изменить это

function toggleDiv(divId) {
   $("#"+divId).toggle();
      $(document).ready(function(){
         $("#myContent").load("getnotes.php?name=<? echo $username; ?>");
      });
   }

К этому

function toggleDiv(divId) {
   $("#"+divId).show();
}

$(document).ready(function(){
   $("#myContent").load("getnotes.php?name=<? echo $username; ?>");
});

ДЕМО

1
Alkis Kalogeris 7 Сен 2013 в 00:57