windows phone 8中jquery左侧面板的问题

Question

我正在制作windows混合应用程序。

我使用了移动版jquery的面板小部件(如汉堡包)。但是它不能正常工作。

当我打开它时，单击任何菜单项并再次单击面板图标(左上角图标)，然后它就消失了。

请帮助我解决同样的问题

代码供参考:

<script type="text/javascript" src="js/MyNetwork.js"></script>
    <script id="panel-init">
        $(function() {
            $("body>[data-role='panel']").panel();
        });
    </script>
<div data-role="panel" id="leftpanel3" data-position="left"
         data-display="reveal"
         style="background-color: #6a666c; line-height: 3em; width: 80%;">

        <ul data-role="listview" data-inset="true"
            style="list-style: none; padding-left: 0px;">
            <li><a href="#emergency" style="text-decoration: none;"
                   onclick='generateEmergencyList();'><img
                        src="img/navbutton_SOS.png" class="ui-li-icon">
                    <div>
                        <span>Send Emergency Message</span>
                    </div></a></li>
            <li><a href="#search" style="text-decoration: none;"><img
                        src="img/navbutton_search_selected.png" class="ui-li-icon">
                    <div>
                        <span>Search</span>
                    </div></a></li>
            <li><a href="#mynetwork" style="text-decoration: none;" onclick="loadMyNetwork();"><img
                src="img/navbutton_mynetwork_selected.png" class="ui-li-icon">
                <div>
                    <span>My Network</span>
                </div></a></li>
            <li><a href="#one" style="text-decoration: none;"><img
                        src="img/navbutton_interest_selected.png" class="ui-li-icon">
                    <div>
                        <span>Colleagues with my Interests</span>
                    </div></a></li>
        </ul>
        <div style="border-bottom: solid 1px;">Settings</div>
        <ul data-role="listview" data-inset="true"
            style="list-style: none; padding-left: 0px;">
            <!--                <li><a href="#one" style="text-decoration: none;"><img src="css/images/icons-png/calendar-black.png"  class="ui-li-icon"><div><span>Settings</span></div></a></li>-->
            <li><a href="#feedback" style="text-decoration: none;"><img
                        src="img/navbutton_feedback_selected.png" class="ui-li-icon">
                    <div>
                        <span>Feedback</span>
                    </div></a></li>
            <li><a href="#help" style="text-decoration: none;"><img
                        src="img/navbutton_help_selected.png" class="ui-li-icon">
                    <div>
                        <span>Help</span>
                    </div></a></li>
            <li><a href="#about" style="text-decoration: none;"><img
                        src="img/navbutton_about_selected.png" class="ui-li-icon">
                    <div>
                        <span>About</span>
                    </div></a></li>
            <li><a href="#emergency_message" style="text-decoration: none;"><img
                        src="img/navbutton_SOSsetting_unselected.png" class="ui-li-icon">
                    <div>
                        <span>Emergency Message Settings</span>
                    </div></a></li>
            <li><a href="" style="text-decoration: none;"
                   onclick="logoutUser();"><img
                        src="img/navbutton_logout_unselected.png" class="ui-li-icon">
                    <div>
                        <span>Logout</span>
                    </div></a></li>
            <li><a href="#myprofile" style="text-decoration: none;"
                   id="myprofile_a_id" data-transition="flow" onclick="preloginajax();"><img
                        src="img/user_profile_silhouette.png" class="ui-li-icon"
                        id="menu_profileimg">
                    <div style="line-height: 20px;">
                        <span><div style="margin-top: 7px; font-size: 20px;"
                                   id="menu_profileName"></div>
                            <p id="menu_profileAddress" style="margin-top: 0px;"></p> </span>
                    </div></a></li>
        </ul>
    </div>

Answer 1

我在WP8中也有同样的问题。我可以看到，即使在导航到菜单项之后，也会触发click()事件。但是滑梯不起作用。您使用的是哪个版本的jQuery ?

为我工作的解决方案是添加下面的函数。

$(document).on('click', '#menu', function () {                
    $("#menu").panel("open");
});