0

我正在创建一个使用 jquery 移动自动完成功能的应用程序。要创建列表视图，我在 js 文件中调用一个函数。当用户在输入字段中输入字符时，它将调用 js 文件，然后我想调用另一个函数，该函数返回以访问数据库中的数据，它将创建和数组对象，这个创建的数组我想传回到调用的函数，然后它将基于该数组创建一个 li 。这是demoautocomplete.js中的代码 

function createlist(autocomplete_name){
var objdata=['user_name','user_id'];

$( "#"+autocomplete_name).on("listviewbeforefilter", function ( e, data ) {
    var autocompleteData=new Array();
    var $ul = $( this ),
        $input = $( data.input ),
        value = $input.val(),
        html = "";
    $ul.html( "" );
   getdatafromtable(autocompleteData,value); var dataarray=getdatafromtable(autocompleteData);
    if ( value && value.length > 1 )
    {
        $.mobile.loading('hide');
        for(var j=0;j<dataarray.length;j++)
        {

            html +="<li id='"+dataarray[j].id+"'>"+dataarray[j].user_name+"</li>";
        }
            $ul.html( html );
            $ul.listview( "refresh" );
            $ul.trigger( "updatelayout");
            $.mobile.activePage.find('input[placeholder="Find a name..."]').attr('id','autocomplete');
        }
     $("ul>li").click(function()
             {
                var textval=$(this).text();
                var id=$(this).attr('id');
                $('#autocomplete').val(textval);
                $.mobile.activePage.find("[data-role=listview]").children().addClass('ui-screen-hidden');
                storeselectedid(id,autocompleteData);
        });
});
    }
function getdatafromtable(autocompleteData,value){
db.transaction(function(tx){
    $.mobile.loading('show');
    var selectQuery='select first_name||" "||last_name user_name,user_id from users where first_name like "%'+value+'%" or last_name like "%'+value+'%" limit 10';
    var selectQuery1='select account_name user_name,account_id from crm_account where account_name like "%'+value+'%" limit 10';
    tx.executeSql(selectQuery,[],function(tx,results){
        var dataset=results.rows;
        if(dataset.length>0){
        for(var i=0;i<dataset.length;i++)
        {
                    var item=dataset.item(i);
                    var element = new Object();
                        element['id']=autocomplete_name+"_"+i;

                    for(var j=0;j<objdata.length;j++)
                    {
                        element[objdata[j]]=item[objdata[j]];

                    }
                autocompleteData[i]=element; 
            }
return autocompleteData;
        }
    });
});  }

这里是 html 中的脚本代码，将从中调用 js：

$(function(){
<ul id="autocomplete" data-role="listview" data-inset="true" data-filter="true" data-filter-placeholder="Find a name..." 
data-filter-theme="d" >
</ul>
var autocomplete=$(document.createElement('ul')).attr('id',autocomplete_name);
    autocomplete.attr('data-role','listview');
    autocomplete.attr('data-inset',true);
    autocomplete.attr('data-filter',true);
    autocomplete.attr('data-filter-placeholder','Find a name');
    autocomplete.appendTo("#contentDemo");
    createlist(autocomplete_name); });

当getdatafromtable函数被调用时，它应该创建填充数组对象中的数据并将该数组对象传递回createlist函数，然后应该执行 if 循环。以下是它应该如何工作的代码流程： 1. 当用户在输入字段中输入一个字符时，页面被加载。2.它将转到js文件，然后将输入值分配给值变量。我想将它传递给函数 getdatafromtable 以便输入它从数据库中获取数据。3.retrive 存储在数组对象中，而不是将其传递回调用它的函数。4.检索数组数据后，它应该创建li listview。任何帮助表示赞赏。提前致谢。

4

1 回答 1

1

假设您的getdatafromtable函数已正确返回数组

var data_array = getdatafromtable(autocompleteData);

在你的getdatafromtable函数中，你应该有一个 return 语句返回一个数组

也不要将您的变量命名为与现有函数相同的名称。autocompleteData在这种情况下，既是局部变量又是函数名。

编辑：

$("#" + autocomplete_name).on("listviewbeforefilter", function (e, data) {
    var autocompleteData = new Array();
    var $ul = $(this),
        $input = $(data.input),
        value = $input.val(),
        html = "";
    $ul.html("");
    getdatafromtable(autocompleteData, $ul, $input, value, html);
});

function after_data_retrieved(autocompleteData, $ul, $input, value, html) {
    if (value && value.length > 1) {
        $.mobile.loading('hide');
        for (var j = 0; j < dataarray.length; j++) {

            html += "<li id='" + dataarray[j].id + "'>" + dataarray[j].user_name + "</li>";
        }
        $ul.html(html);
        $ul.listview("refresh");
        $ul.trigger("updatelayout");
        $.mobile.activePage.find('input[placeholder="Find a name..."]').attr('id', 'autocomplete');
    }
    $("ul>li").click(function () {
        var textval = $(this).text();
        var id = $(this).attr('id');
        $('#autocomplete').val(textval);
        $.mobile.activePage.find("[data-role=listview]").children().addClass('ui-screen-hidden');
        storeselectedid(id, autocompleteData);
    });
}

function getdatafromtable(autocompleteData,  $ul, $input, value, html) {
    db.transaction(function (tx) {
        $.mobile.loading('show');
        var selectQuery = 'select first_name||" "||last_name user_name,user_id from users where first_name like "%' + value + '%" or last_name like "%' + value + '%" limit 10';
        var selectQuery1 = 'select account_name user_name,account_id from crm_account where account_name like "%' + value + '%" limit 10';
        tx.executeSql(selectQuery, [], function (tx, results) {
            var dataset = results.rows;
            if (dataset.length > 0) {
                for (var i = 0; i < dataset.length; i++) {
                    var item = dataset.item(i);
                    var element = new Object();
                    element['id'] = autocomplete_name + "_" + i;

                    for (var j = 0; j < objdata.length; j++) {
                        element[objdata[j]] = item[objdata[j]];

                    }
                    autocompleteData[i] = element;
                }
            }
            after_data_retrieved(autocompleteData, $ul, $input, value, html);
        });
    });
}
于 2013-09-04T09:49:57.273 回答