0

大家好,

在我的应用程序中,我使用自动完成功能,列表为

        <p>
            <input type="text" id="searchField" placeholder="Categories">
            <ul id="suggestions" data-role="listview" data-inset="true"></ul>
        </p>

我有一个数组名称 myArray 并使用自动完成作为:

$("#searchField").autocomplete(
                        {
                            target: $('#suggestions'),
                            source: myArray ,
                            link: 'target.html?term=',
                            minLength:0
                        });

现在我想获取我单击的列表项名称并在 target.html 文件中使用该变量。如何得到它?提前致谢。

4

4 回答 4

2

从他们的帮助文档中。

打回来

当使用可选的回调函数时 autoComplete 将只执行在回调中找到的代码。点击事件对象被传递到回调函数中,用于访问包含在选择中的信息。这是一个用例:

$("#searchField").autocomplete("update", {
    source: [ "foo", "bar", "baz" ],
    minLength: 3,
    callback: function(e) {
        var $a = $(e.currentTarget); // access the selected item
        $('#searchField').val($a.text()); // place the value of the selection into the search box
        $("#searchField").autocomplete('clear'); // clear the listview
    }
});

选项 1 此部分将允许您访问文本字段

$('#searchField').val($a.text()); // or $a.value()

所以在回调事件中做这样的事情

window.location.replace("http://stackoverflow.com?target=" + $a.text());

选项 2 似乎他们希望结果集采用这种格式(文本和值),所以如果你需要其他值,你需要求助于 jquery 自动完成(这个组件基于)

 $('#some_id').autocomplete({
                source: function (request, response) {
                    $.ajax({
                        url: 'some_url',
                        dataType: "json",
                        data: {
                            filter: request.term
                        },
                        success: function (data) {
                            response($.map(eval(data), function (item) {
                                return {
                                    label: item.Text,
                                    value: item.Value,
                                    extra_value: item.Extra_Value
                                }
                            }));
                        }
                    })
                },
                maxLength: 2,
                select: function (event, ui) {
                    $("#Some_id2").attr('value', ui.item.extra_value);
                }
            });

更新又名选项 3 从他们的演示代码中,如果您只需要文本值,并且不需要 ID(如您的情况),只需更改您的源格式。而不是从服务器返回一个 JSON 结果返回一个字符串数组,或者将 JSON 结果转换为一个字符串数组,你喜欢哪种风格

(来自他们演示页面上的工作示例的代码)

var availableTags = ['24', 'about me',... , 'XUIJS'];

    $("#searchField").autocomplete({
        target: $('#suggestions'),
        source: availableTags,
        link: 'target.html?term=',
        minLength: 1,
        matchFromStart: false
    });
于 2012-07-04T06:44:28.137 回答
0

使用回调。

$("#searchField").autocomplete(
                        {
                            target: $('#suggestions'),
                            source: myArray ,
                            link: 'javascript:void();',
                            minLength:0,
                            callback: function(e){

                                var name = $(e.target).attr('name');
           //This function will be called when one of the suggestions is clicked according to documentation
                                window.location = 'target.html?term='  // This line might need some tweaking. 
                            }
                        });

该代码未经测试,您可能需要逐步调试此代码。

于 2012-07-04T06:02:38.360 回答
0

如果我使用

$("#searchField").autocomplete(
                        {
                            icon: 'arrow-l', 
                            target: $('#suggestions'),
                            source: stockArray,
                            link: 'target.html?term=',
                            minLength:0,
                            callback: function(e)
                            {

                                var nameq = $(e.currentTarget); 
                                console.log("^^^^^^^^^^^^^^^^^^^^^"+nameq);
                                //This function will be called when one of the suggestions is clicked according to documentation
                                window.location = 'target.html?term='  
                            }

                        });

我得到 nameq 的值为

^^^^^^^^^^^^^^^^^^^^^[object Object] at file:///android_asset/www/index.html:115

如果我使用

$("#searchField").autocomplete(
                        {
                            icon: 'arrow-l', 
                            target: $('#suggestions'),
                            source: stockArray,
                            link: 'target.html?term=',
                            minLength:0,
                            callback: function(e){

                             var nameq = $(e.target).attr('name');

                             console.log("^^^^^^^^^^^^^^^^^^^^^^^^^^"+nameq);
                            //This function will be called when one of the suggestions is clicked according to documentation
                            window.location = 'target.html?term='  // This line might need some tweaking. 
                        }

我得到 nameq 的值为:

^^^^^^^^^^^^^^^^^^^^^^^^^^undefined at file:///android_asset/www/index.html:115
于 2012-07-04T09:39:36.020 回答
0
$("#searchField").autocomplete(
                        {
                            icon: 'arrow-l', 
                            target: $('#suggestions'),
                            source: stockArray,
                            link: 'target.html?term=',
                            minLength:0,
                            callback: function(e)
                            {

                                var $a = $(e.currentTarget); // access the selected item
                                console.log("###################!!###"+$a.text());
                                $('#searchField').val($a.text()); // place the value of the selection into the search box
                                $("#searchField").autocomplete('clear'); // clear the listview
                            }


                        });

现在使用 $a.text() 我得到选定的项目值。

于 2012-07-04T11:38:39.977 回答