Java 难以将JQuery幻灯片菜单与现有移动站点集成

Java 难以将JQuery幻灯片菜单与现有移动站点集成,java,jquery,mobile,Java,Jquery,Mobile,我有一个用Java编写并托管在Tomcat上的现有移动站点,我正试图为其集成此幻灯片菜单 然而,我有一个非常奇怪的问题,这似乎是我的三星Galaxy S3浏览器特有的,因为我在Chrome或Firefox上没有看到同样的问题 当我点击滑动菜单中的一个菜单链接时,它会将我重定向到我指定的URL,但会添加一个#符号。比如说 domain.mobi/#/help.jsp?helpsource=index.jsp <?xml version="1.0"?> <!DOCTYPE htm

我有一个用Java编写并托管在Tomcat上的现有移动站点,我正试图为其集成此幻灯片菜单

然而,我有一个非常奇怪的问题,这似乎是我的三星Galaxy S3浏览器特有的,因为我在Chrome或Firefox上没有看到同样的问题

当我点击滑动菜单中的一个菜单链接时,它会将我重定向到我指定的URL,但会添加一个#符号。比如说

domain.mobi/#/help.jsp?helpsource=index.jsp

<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" 
                   "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<c:set var="locale" value="en"/>
<c:if test="${not empty param.locale}">
  <c:set var="locale" value="${param.locale}"/>
</c:if>
<fmt:setLocale value="${locale}"/>
<fmt:setBundle basename="chale"/>
<%@taglib uri="/WEB-INF/tld/chale.tld" prefix="chale" %>

<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320"/>
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta http-equiv="cleartype" content="on">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">

 <link href="css/themes/jqmfb.min.css" rel="stylesheet" type="text/css">
 <link href="css/chale_style.css" rel="stylesheet" type="text/css">
 <link href="css/jquery.mobile.structure.min.css" rel="stylesheet" type="text/css">

<!--Include JQM and JQ-->

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js">    </script>
 <script src="js/jquery.animate-enhanced.min.js"></script>

        <!--JQM globals you can edit or remove file entirely... note it needs to be loaded     before jquerymobile js -->
<script src="js/jqm.globals.js"></script>

<script src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>

<!--JQM SlideMenu-->
<link rel="stylesheet" href="css/jqm.slidemenu.css" />
<script src="js/jqm.slidemenu.js"></script>  
<title><fmt:message key="index.pagetitle"/></title>
</head>
<body>
<c:set var="pageVal" value="0"/>
<c:if test="${not empty param.page}">
<c:set var="pageVal" value="${param.page}"/> 
</c:if>



<div id="slidemenu">

    <div id="profile">

        <div class="profile_info"><strong>Chale</strong></div>
    </div>

    <h3>MENU</h3>

    <ul>
        <c:url var="finder" value="m/browse.jsp"/>
        <li><a href="${finder}"><img src="../img/smico4.png"><fmt:message key="index.optionflirtfinder"/></a></li>

        <c:url var="fav" value="m/favourites.jsp"/>
        <li><a href="${fav}"><img src="../img/smico4.png"><fmt:message key="general.favourites"/></a></li>


        <c:url var="message" value="m/messaging.jsp"><c:param name="messagesource" value="../index.jsp"/></c:url>
        <li><a href="${message}"><img src="../img/smico4.png"><fmt:message key="general.messages"><fmt:param value="${unreadMessages}"/></fmt:message></a></li>

        <c:url var="chat" value="chat/checkdetailsservlet"/>
        <li><a href="${chat}"><img src="../img/smico4.png"><fmt:message key="index.optionchatcentral"/></a></li>

        <c:url var="prof" value="m/profile.jsp"/>
        <li><a href="${prof}"><img src="../img/smico4.png"><fmt:message key="index.optionmyprofile"/></a></li>

        <c:url var="help" value="help.jsp"><c:param name="helpsource" value="index.jsp"/></c:url>
        <li><a href="${help}"><img src="../img/smico4.png"><fmt:message key="general.helpcentre"/></a></li>

    </ul>


</div>

<div data-role="page" id="main_page" data-theme="a">

    <div data-role="header" data-position="fixed" data-tap-toggle="false" data-   update-page-padding="false">
        <a href="@" data-slidemenu="#slidemenu" data-slideopen="false" data-icon="smico" data-corners="false" data-iconpos="notext">Menu</a>
        <h1>Chale</h1>
    </div>
然而它应该是

domain.mobi/help.jsp?helpsource=index.jsp

<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" 
                   "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<c:set var="locale" value="en"/>
<c:if test="${not empty param.locale}">
  <c:set var="locale" value="${param.locale}"/>
</c:if>
<fmt:setLocale value="${locale}"/>
<fmt:setBundle basename="chale"/>
<%@taglib uri="/WEB-INF/tld/chale.tld" prefix="chale" %>

<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320"/>
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta http-equiv="cleartype" content="on">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">

 <link href="css/themes/jqmfb.min.css" rel="stylesheet" type="text/css">
 <link href="css/chale_style.css" rel="stylesheet" type="text/css">
 <link href="css/jquery.mobile.structure.min.css" rel="stylesheet" type="text/css">

<!--Include JQM and JQ-->

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js">    </script>
 <script src="js/jquery.animate-enhanced.min.js"></script>

        <!--JQM globals you can edit or remove file entirely... note it needs to be loaded     before jquerymobile js -->
<script src="js/jqm.globals.js"></script>

<script src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>

<!--JQM SlideMenu-->
<link rel="stylesheet" href="css/jqm.slidemenu.css" />
<script src="js/jqm.slidemenu.js"></script>  
<title><fmt:message key="index.pagetitle"/></title>
</head>
<body>
<c:set var="pageVal" value="0"/>
<c:if test="${not empty param.page}">
<c:set var="pageVal" value="${param.page}"/> 
</c:if>



<div id="slidemenu">

    <div id="profile">

        <div class="profile_info"><strong>Chale</strong></div>
    </div>

    <h3>MENU</h3>

    <ul>
        <c:url var="finder" value="m/browse.jsp"/>
        <li><a href="${finder}"><img src="../img/smico4.png"><fmt:message key="index.optionflirtfinder"/></a></li>

        <c:url var="fav" value="m/favourites.jsp"/>
        <li><a href="${fav}"><img src="../img/smico4.png"><fmt:message key="general.favourites"/></a></li>


        <c:url var="message" value="m/messaging.jsp"><c:param name="messagesource" value="../index.jsp"/></c:url>
        <li><a href="${message}"><img src="../img/smico4.png"><fmt:message key="general.messages"><fmt:param value="${unreadMessages}"/></fmt:message></a></li>

        <c:url var="chat" value="chat/checkdetailsservlet"/>
        <li><a href="${chat}"><img src="../img/smico4.png"><fmt:message key="index.optionchatcentral"/></a></li>

        <c:url var="prof" value="m/profile.jsp"/>
        <li><a href="${prof}"><img src="../img/smico4.png"><fmt:message key="index.optionmyprofile"/></a></li>

        <c:url var="help" value="help.jsp"><c:param name="helpsource" value="index.jsp"/></c:url>
        <li><a href="${help}"><img src="../img/smico4.png"><fmt:message key="general.helpcentre"/></a></li>

    </ul>


</div>

<div data-role="page" id="main_page" data-theme="a">

    <div data-role="header" data-position="fixed" data-tap-toggle="false" data-   update-page-padding="false">
        <a href="@" data-slidemenu="#slidemenu" data-slideopen="false" data-icon="smico" data-corners="false" data-iconpos="notext">Menu</a>
        <h1>Chale</h1>
    </div>
这会有效地打断页面,因为该页面上的滑块菜单不再工作

有什么想法吗

下面是我index.jsp上的代码

<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" 
                   "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<c:set var="locale" value="en"/>
<c:if test="${not empty param.locale}">
  <c:set var="locale" value="${param.locale}"/>
</c:if>
<fmt:setLocale value="${locale}"/>
<fmt:setBundle basename="chale"/>
<%@taglib uri="/WEB-INF/tld/chale.tld" prefix="chale" %>

<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320"/>
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta http-equiv="cleartype" content="on">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">

 <link href="css/themes/jqmfb.min.css" rel="stylesheet" type="text/css">
 <link href="css/chale_style.css" rel="stylesheet" type="text/css">
 <link href="css/jquery.mobile.structure.min.css" rel="stylesheet" type="text/css">

<!--Include JQM and JQ-->

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js">    </script>
 <script src="js/jquery.animate-enhanced.min.js"></script>

        <!--JQM globals you can edit or remove file entirely... note it needs to be loaded     before jquerymobile js -->
<script src="js/jqm.globals.js"></script>

<script src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>

<!--JQM SlideMenu-->
<link rel="stylesheet" href="css/jqm.slidemenu.css" />
<script src="js/jqm.slidemenu.js"></script>  
<title><fmt:message key="index.pagetitle"/></title>
</head>
<body>
<c:set var="pageVal" value="0"/>
<c:if test="${not empty param.page}">
<c:set var="pageVal" value="${param.page}"/> 
</c:if>



<div id="slidemenu">

    <div id="profile">

        <div class="profile_info"><strong>Chale</strong></div>
    </div>

    <h3>MENU</h3>

    <ul>
        <c:url var="finder" value="m/browse.jsp"/>
        <li><a href="${finder}"><img src="../img/smico4.png"><fmt:message key="index.optionflirtfinder"/></a></li>

        <c:url var="fav" value="m/favourites.jsp"/>
        <li><a href="${fav}"><img src="../img/smico4.png"><fmt:message key="general.favourites"/></a></li>


        <c:url var="message" value="m/messaging.jsp"><c:param name="messagesource" value="../index.jsp"/></c:url>
        <li><a href="${message}"><img src="../img/smico4.png"><fmt:message key="general.messages"><fmt:param value="${unreadMessages}"/></fmt:message></a></li>

        <c:url var="chat" value="chat/checkdetailsservlet"/>
        <li><a href="${chat}"><img src="../img/smico4.png"><fmt:message key="index.optionchatcentral"/></a></li>

        <c:url var="prof" value="m/profile.jsp"/>
        <li><a href="${prof}"><img src="../img/smico4.png"><fmt:message key="index.optionmyprofile"/></a></li>

        <c:url var="help" value="help.jsp"><c:param name="helpsource" value="index.jsp"/></c:url>
        <li><a href="${help}"><img src="../img/smico4.png"><fmt:message key="general.helpcentre"/></a></li>

    </ul>


</div>

<div data-role="page" id="main_page" data-theme="a">

    <div data-role="header" data-position="fixed" data-tap-toggle="false" data-   update-page-padding="false">
        <a href="@" data-slidemenu="#slidemenu" data-slideopen="false" data-icon="smico" data-corners="false" data-iconpos="notext">Menu</a>
        <h1>Chale</h1>
    </div>

Chale
菜单
查尔
了解您所面临的问题<代码>
搜索关键字:hash

domain.mobi/#/help.jsp?helpsource=index.jsp

要解决此问题,您需要在url中添加数据ajax=“false”

<a href="${finder}" data-ajax="false"><img src="../img/smico4.png"><fmt:message key="index.optionflirtfinder"/></a>

如果链接链接到另一个站点或域,您还必须添加
rel=“external”


参考:嗨,德里克,是的,没错。当然,我会编辑我的问题并添加一些代码谢谢,我现在就试试。你知道为什么它在Chrome或Firefox中不这么做吗?嗨,德里克,请告诉我你的电子邮件地址。我想请你做一些工作