我正在为内部 Web 应用程序开发移动选项。我有一个在 PC 端工作的自动选择，但是在移动端查看时，搜索结果在显示时看起来很糟糕： 格式错误 http://www.rkrdevel.com/files/mobile_autoselect.png
理想情况下，我希望列表视图看起来更像一个下拉列表。在手机上显示时，我知道它可能会列在键盘下方，但目前还可以。
我在我的主站点和移动站点上都使用了相同的代码片段。为了确定它是否是移动设备，我调用了一个我制作的函数：check_mobile()。
我在某处找到了自动选择代码，但不确定如何将格式应用于结果集。任何帮助表示赞赏。
html:
<div class="ui-widget">
<p>To find a customer, enter the Customer name, all lower case and no spaces. For example, bwi or t&r</p>
<label for="Customer">Customer Name: </label>
<input id="Customer" placeholder="Search"/>
<div class="ui-widget" id="results" style="width: 600px; font-weight: bold; border-bottom: black;">Search Results: </div>
<div data-theme="b" id="custData" data-collapsed="true" data-role="collapsible"></div><!--class="ui-widget-content"-->
</div>
jquery自动选择功能：
init: function(){
$('#results').hide();
$( "#Customer" ).val('');
$( "#Customer" )
// don't navigate away from the field on tab when selecting an item
.bind( "keydown", function( event ) {
if ( event.keyCode === $.ui.keyCode.TAB &&
$( this ).data( "autocomplete" ).menu.active ) {
event.preventDefault();
}
})
.autocomplete({
delay: 500,
source: function( request, add ) {
$.getJSON( cust.url+"?funct=1" , {term: cust.extractLast( request.term )}, function(data) {
//create array for response objects
var suggestions = [];
//process response
for(var i =1, ii=data[0];i<=ii;i++){
suggestions.push(data[i].ABAN8 + ':' + $.trim(data[i].ABDC));
}
//pass array to callback
add(suggestions);
});
},
search: function() {
// custom minLength
$( "#custData" ).hide();
$('#results').hide();
var term = cust.extractLast( this.value );
if ( term.length < 2 ) {
cust.clearReportData();
return false;
}
},
focus: function() {
// prevent value inserted on focus
return false;
},
select: function( event, ui ) {
var terms = cust.split( this.value );
// remove the current input
terms.pop();
// add the selected item
terms.push( ui.item.value );
// add placeholder to get the comma-and-space at the end
terms.push( "" );
cust.getfulldetail(ui.item.value);
return false;
}
})
.focus();
},