Question

我在jQuery Mobile（JQM）中遇到了一个有趣的问题。

您应该事先知道我有一个单页模板设置（单独的页面）设置以下全局配置选项，主要是为了关闭ajax和jQM哈希导航系统。

$(document).bind("mobileinit", function(){
$.mobile.ajaxEnabled = "false";
$.mobile.buttonMarkup.hoverDelay = "100";   
$.mobile.defaultPageTransition = "none";    
$.mobile.hashListeningEnabled = "false";
$.mobile.pushStateEnabled = "false";
$.mobile.loader.prototype.options.textVisible = true;
});

问题

我有一个搜索结果页面，显然会显示搜索结果。页面内是另一种允许用户优化搜索的表单。有时用户会认为他们不喜欢精炼结果，他们会想要单击后退按钮来显示其原始结果集。问题是，在JQM网站上，当为此目的单击/点击后退按钮时，用户不会被带回原始搜索结果，而是被带到站点的索引页面。

有趣的是，页面（减去JQM特定的脚本/ css）与静态html版本相同。该版本的行为应该如此。

问题：

我是否错过了一个有用的全局配置选项？ JQM还有其他任何可能导致此问题的原因吗？

标记：

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="ISO-8859-1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
<title>Search Results</title> 
<!-- JQM CSS -->
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<!-- Custom Theme CSS -->
<link rel="stylesheet" href="themes/cayce.css" />
<!-- Custom CSS -->
<link rel="stylesheet" href="css/custom.css" />
<!-- Jquery -->
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script type="text/javascript">
if (typeof jQuery == 'undefined') {
    document.write(unescape("%3Cscript src='js/jquery-1.8.2.min.js' type='text/javascript'%3E%3C/script%3E"));
}
</script>
<!-- Custom Jquery -->
<script type="text/javascript" src="js/custom.js"></script>
<!-- jQuery Mobile-->
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
<script type="text/javascript">
if (typeof jQuery == 'undefined') {
    document.write(unescape("%3Cscript src='js/jquery.mobile.1.2.0.min.js' type='text/javascript'%3E%3C/script%3E"));
}
</script>
</head>  
<body> 
<div data-role="page" id="searchresults">
<div data-role="header">
<h1>Search Results</h1>
<a href="javascript:history.go(-1)" data-icon="back" class="ui-btn-left">Back</a>
<a href="WebCatPageServer.exe?Landing" data-icon="home" class="ui-btn-right">Menu</a>
<div class="header-sub">
<div class="logo">
<a href="WebCatPageServer.exe?Landing">
<img src="themes/images/logo.png" width="100" height="49" alt="Company Logo">
</a>
</div>
</div>
</div><!-- /header -->
<div data-role="content">
<div class="ui-bar ui-bar-e">
<p>We found a total of <b>SPI_SearchHitCount</b> products containing<p>
<p><b>"SPI_SearchStrDisp"</b></p>
<!--Results SPI_SearchStart thru SPI_SearchEnd-->
</div>
<div data-role="collapsible" data-collapsed="true" data-content-theme="d" style="margin-top:15px;">
<h3>Refine/New Search</h3>
<form name="RefineSearchForm" id="RefineSearchForm" method="post"  action="WebCatPageServer.exe?DO_SEARCH">
<input name="Action" type="hidden" value="Search">
<input name="SearchType" type="hidden" value="AND">
<input name="FullSearch" type="hidden" value="SPI_SearchFull">
<input name="PrevSearchText" type="hidden" value="SPI_SearchPSearch">
<input name="Start" type="hidden" value="1">
<input name="New" type="hidden" value="SPI_SearchNew">
<input name="Refine" type="hidden" value="SPI_SearchRefine">
<input name="SearchMF" type="hidden" value="SPI_SearchSearchMF">
<input type="search" name="Search Term" id="refinesearch" value=""  />
<div class="ui-grid-a">
<div class="ui-block-a">
<!-- SPI_HTML_RefineResults_Btn -->
<input type="submit" name="refinesearch" data-theme="c" value="Refine Search"/>
<!-- SPI_HTML_RefineResults_Btn --></div>
<div class="ui-block-b"><input type="submit" data-theme="c" name="newsearch" onClick="javascript:document.RefineSearchForm.Refine.value='NO';document.RefineSearchForm.PrevSearchText.value='';document.RefineSearchForm.New.value='YES';" value="New Search"></div>
</div><!-- /grid-a -->
</p>
</form>
</div>
<fieldset class="ui-grid-a">
<div class="ui-block-a">
<!-- SPI_HTML_PrevResults_Link -->
                    <form name="PrevSearchForm" method="post" action="WebCatPageServer.exe?DO_SEARCH" class="noprint">
                        <input name="Action" type="hidden" value="Search">
                        <input name="SearchType" type="hidden" value="AND">
                        <input name="FullSearch" type="hidden" value="SPI_SearchFull">
                        <input name="PrevSearchText" type="hidden" value="SPI_SearchPSearch">
                        <input name="Start" type="hidden" value="SPI_SearchPrevStart">
                        <input name="New" type="hidden" value="NO">
                        <input name="Refine" type="hidden" value="NO">
                        <input name="SearchMF" type="hidden" value="SPI_SearchSearchMF">
                        <input name="SearchText" type="hidden" value="">
                        <input name="ResultsPerPage" type="hidden" value="SPI_SearchResultsPerPage">
                        <input type="submit" data-icon="arrow-l" value="Previous" />
                    </form>
<!-- SPI_HTML_PrevResults_Link -->
</div>
<div class="ui-block-b">
<!-- SPI_HTML_NextResults_Link -->
                    <form name="NextSearchForm" method="post" action="WebCatPageServer.exe?DO_SEARCH" class="noprint">
                        <input name="Action" type="hidden" value="Search">
                        <input name="SearchType" type="hidden" value="AND">
                        <input name="FullSearch" type="hidden" value="SPI_SearchFull">
                        <input name="PrevSearchText" type="hidden" value="SPI_SearchPSearch">
                        <input name="Start" type="hidden" value="SPI_SearchNextStart">
                        <input name="New" type="hidden" value="NO">
                        <input name="Refine" type="hidden" value="NO">
                        <input name="SearchMF" type="hidden" value="SPI_SearchSearchMF">
                        <input name="SearchText" type="hidden" value="">
                        <input name="ResultsPerPage" type="hidden" value="SPI_SearchResultsPerPage">
                        <input type="submit" data-icon="arrow-r" value="Next"/>
                    </form>
<!-- SPI_HTML_NextResults_Link -->
</div>
</fieldset>
<!-- SPI_HTML_Results -->
<form name="AddItem" method="post" action="WebCatPageServer.exe">
<input name="Action" type="hidden" value="Add_Item">
<ul data-role="listview" data-inset="true" data-theme="d" data-dividertheme="d" data-split-icon="plus" data-split-theme="d">
<!-- SPI_HTML_Product_LevelEntry -->
<li data-role="list-divider" class="listdivider">SPI_Level3Entry</li>
<!-- SPI_HTML_Product_LevelEntry -->
<!-- SPI_HTML_Product_Entry1 -->
<li class="prod">
<!-- SPI_HTML_Product_Thumbnail -->
<a href="SPI_ProdFullLink"><!--<img src="SPI_ProdThumbnail" width="75" height="75" alt="SPI_ProdEntryID"/>-->
<!-- SPI_HTML_Product_Thumbnail -->
<!-- SPI_HTML_Product_LinkItemNum -->
<h3>SPI_ProdEntryID</h3>
<!-- SPI_HTML_Product_LinkItemNum -->
<!-- SPI_HTML_Product_Entry_Others -->
<p class="space"><b>Part #</b>: SPI_ProdEntryOther</p>
<!-- SPI_HTML_Product_Entry_Others -->
<p class="description"><b>Description</b>: SPI_ProdEntryDesc</p>
<!-- SPI_HTML_AllowOrderPlacement -->
<!-- SPI_HTML_AllowViewPriceAvail -->
<p class="space"><b>Qty Avail</b>: SPI_ProdQtyAvail</p>
<p class="space"><b>Unit Price</b>: <span class="price">SPI_ProdEntryPrice</span></p>
<!-- SPI_HTML_AllowViewPriceAvail -->
<input type="number" class="nolink" name="SPI_CartOrdQtyFieldName" value="" tabindex="SPI_CartOrdQtyTabIndex" />
</a>
<input name="SPI_CartProductIDFieldName" type="hidden" value="SPI_ProductID" class="noprint"/>
<input name="SPI_CartMfgProdIDFieldName" type="hidden" value="SPI_MfgProdID" class="noprint"/>
<input name="SPI_CartProductDescFieldName" type="hidden" value="SPI_ProductDesc" class="noprint"/>
<a href="#" onClick="javascript:if (document.AddItem.SPI_CartOrdQtyFieldName.value==0){document.AddItem.SPI_CartOrdQtyFieldName.value='1'};document.AddItem.submit();">Add</a>
<!-- SPI_HTML_AllowOrderPlacement -->
</li>
<!-- SPI_HTML_Product_Entry1 -->
<!-- SPI_HTML_Product_Entry2 -->
<li class="prod">
<!-- SPI_HTML_Product_Thumbnail -->
<a href="SPI_ProdFullLink"><!--<img src="SPI_ProdThumbnail" width="75" height="75" alt="SPI_ProdEntryID"/>-->
<!-- SPI_HTML_Product_Thumbnail -->
<!-- SPI_HTML_Product_LinkItemNum -->
<h3>SPI_ProdEntryID</h3>
<!-- SPI_HTML_Product_LinkItemNum -->
<!-- SPI_HTML_Product_Entry_Others -->
<p class="space"><b>Part #</b>: SPI_ProdEntryOther</p>
<!-- SPI_HTML_Product_Entry_Others -->
<p class="description"><b>Description</b>: SPI_ProdEntryDesc</p>
<!-- SPI_HTML_AllowOrderPlacement -->
<!-- SPI_HTML_AllowViewPriceAvail -->
<p class="space"><b>Qty Avail</b>: SPI_ProdQtyAvail</p>
<p class="space"><b>Unit Price</b>: <span class="price">SPI_ProdEntryPrice</span></p>
<!-- SPI_HTML_AllowViewPriceAvail -->
<input type="number" class="nolink" name="SPI_CartOrdQtyFieldName" value="" tabindex="SPI_CartOrdQtyTabIndex" />
</a>
<input name="SPI_CartProductIDFieldName" type="hidden" value="SPI_ProductID" class="noprint"/>
<input name="SPI_CartMfgProdIDFieldName" type="hidden" value="SPI_MfgProdID" class="noprint"/>
<input name="SPI_CartProductDescFieldName" type="hidden" value="SPI_ProductDesc" class="noprint"/>
<a href="#" onClick="javascript:if (document.AddItem.SPI_CartOrdQtyFieldName.value==0){document.AddItem.SPI_CartOrdQtyFieldName.value='1'};document.AddItem.submit();">Add</a>
<!-- SPI_HTML_AllowOrderPlacement -->
</li>
<!-- SPI_HTML_Product_Entry2 -->
</ul>
</form>
<!-- SPI_HTML_Results -->
<br>
<fieldset class="ui-grid-a">
<div class="ui-block-a">
<!-- SPI_HTML_PrevResults_Link -->
                    <form name="PrevSearchForm" method="post" action="WebCatPageServer.exe?DO_SEARCH" class="noprint">
                        <input name="Action" type="hidden" value="Search">
                        <input name="SearchType" type="hidden" value="AND">
                        <input name="FullSearch" type="hidden" value="SPI_SearchFull">
                        <input name="PrevSearchText" type="hidden" value="SPI_SearchPSearch">
                        <input name="Start" type="hidden" value="SPI_SearchPrevStart">
                        <input name="New" type="hidden" value="NO">
                        <input name="Refine" type="hidden" value="NO">
                        <input name="SearchMF" type="hidden" value="SPI_SearchSearchMF">
                        <input name="SearchText" type="hidden" value="">
                        <input name="ResultsPerPage" type="hidden" value="SPI_SearchResultsPerPage">
                        <input type="submit" data-icon="arrow-l" data-theme="c" value="Previous" />
                    </form>
<!-- SPI_HTML_PrevResults_Link -->
</div>
<div class="ui-block-b">
<!-- SPI_HTML_NextResults_Link -->
                    <form name="NextSearchForm" method="post" action="WebCatPageServer.exe?DO_SEARCH" class="noprint">
                        <input name="Action" type="hidden" value="Search">
                        <input name="SearchType" type="hidden" value="AND">
                        <input name="FullSearch" type="hidden" value="SPI_SearchFull">
                        <input name="PrevSearchText" type="hidden" value="SPI_SearchPSearch">
                        <input name="Start" type="hidden" value="SPI_SearchNextStart">
                        <input name="New" type="hidden" value="NO">
                        <input name="Refine" type="hidden" value="NO">
                        <input name="SearchMF" type="hidden" value="SPI_SearchSearchMF">
                        <input name="SearchText" type="hidden" value="">
                        <input name="ResultsPerPage" type="hidden" value="SPI_SearchResultsPerPage">
                        <input type="submit" data-icon="arrow-r" data-theme="c" value="Next"/>
                    </form>
<!-- SPI_HTML_NextResults_Link -->
</div>
</fieldset>
</div><!-- /content -->
<div data-role="footer">
</div><!-- /footer -->
<script type="text/javascript">
$('#searchresults').on('pageshow', function () {
    $('a input.nolink').each(function() {
        var default_value = this.value;
        $(this).focus(function() {
            if(this.value == default_value) {
                this.value = '';
            }
            $('a input.nolink').click(function(event) {
                event.preventDefault();
                event.stopPropagation();
            }
            );
        }
        );
    }
    );
    $('body').append('<div data-role="popup" id="popupBasic" data-transition="pop" >'+
            '<p>Please enter keyword(s) in the search input field.</p>'+
            '</div>');
    $( "#popupBasic" ).popup();
    var search_cmds = $('input[name="newsearch"][type="submit"]').attr('onclick');
    $('input[name="newsearch"][type="submit"]').attr('onclick','');
    $('input[name="refinesearch"], input[name="newsearch"][type="submit"]').on('click', function() {
        if ($('#refinesearch').val()=='') {
            //$( "#popupBasic" ).trigger('create');
            $( "#popupBasic" ).popup( "open" );
            setTimeout(function() {
                $( "#popupBasic" ).popup( "close" );
            }
            ,1500);
            return false;
        }
        if ($(this).attr('name')=='newsearch') {
            /*document.RefineSearchForm.Refine.value='NO';
            document.RefineSearchForm.PrevSearchText.value='';
            document.RefineSearchForm.New.value='YES';*/
            eval(search_cmds);
        }
    }
    )
}
);
</script>
</div><!-- /page -->
</body>
</html>

感谢我非常感谢你的时间，伙计们！

更新现在已经解决了。我的JQM全局配置选项中存在语法错误。这应该如下所示：

$(document).bind("mobileinit", function(){
$.mobile.ajaxEnabled = false;
$.mobile.buttonMarkup.hoverDelay = 100;     
$.mobile.hashListeningEnabled = false;
$.mobile.pushStateEnabled = false;
$.mobile.loader.prototype.options.textVisible = true;
});

Answer 1

而不是使用

<a href="javascript:history.go(-1)">

尝试像这样工作的jqm内置函数

<a data-role="button" data-rel="back" data-icon="arrow-l">back</a>

有关详细信息和详细信息，请查看此处的官方文档

http://jquerymobile.com/demos/1.2.0/docs/pages/page-links.html

让我知道它是否有用

表单提交后的jQuery Mobile Back Button

1 个答案: