0

我正在创建一个使用自动完成视图的应用程序,该列表是在 js 文件中动态创建的。知道我想要的是,如果我创建了多个我想要应用的自动竞争并且不同的 id 到由 jquery 移动自动完成创建的输入 type='search' 我试图将 id 应用到输入字段但发生了什么是它将健全的 id 应用于角色 =“搜索”的所有输入字段。但我想为角色 ='search' 的每个输入字段提供不同的 id。这是自动完成的js代码:

$( document ).on( "pageinit", "#myPage", function() {
$( "#autocomplete" ).on( "listviewbeforefilter", function ( e, data ) {
    var $ul = $( this ),
        $input = $( data.input ),
        value = $input.val(),
        html = "";
    $ul.html( "" );
    if ( value && value.length > 1 ) {

         html +="<li >Xyz</li>";
         html +="<li >Abc</li>";

         $ul.html( html );
         $ul.listview( "refresh" );
         $ul.trigger( "updatelayout");
         $.mobile.activePage.find('input[data-type="search"]').attr('id','namesearch');

    }

    $("ul>li").click(function(){

        var textval=$(this).text();
        $('#namesearch').val(textval);
        $.mobile.activePage.find("[data-role=listview]").children().addClass('ui-screen-hidden');

    });
});

$("#autocomplete1").on("listviewbeforefilter",function(e,data){
    var $ul = $(this),
        $input=$(data.input),
        value = $input.val(),
        html = "";
    $ul.html('');
    if(value && value.length >1) {
        html +="<li>efg</li>";
        html +="<li>hijk</li>";
        $ul.html(html);
        $ul.listview("refresh");
        $ul.trigger("updatelayout");

         $('#autocomplete').parent('div').find('input[data-type="search"]').attr('id','namesearch1');
    }
    $("ul>li").click(function(){
        var textval1 = $(this).text();
        $("#namesearch1").val(textval1);
        $.mobile.activePage.find("[data-role=listview]").children().addClass('ui-screen-hidden');
    });
});});

这是创建 ul 的 html 代码:

<ul id="autocomplete" data-role="listview" data-inset="true" data-filter="true" data-filter-placeholder="Find a city..."  data-filter-theme="d">
            </ul>

            <ul id="autocomplete1" data-role="listview" data-inset="true" data-filter="true" data-filter-placeholder="Find a city..."  data-filter-theme="d">
            </ul>
4

1 回答 1

0

在提出问题之前,我没有找到一个简单的更改。我只是更改代码形式:

 $.mobile.activePage.find('input[data-type="search"]').attr('id','namesearch');

对此:

 $.mobile.activePage.find('input[placeholder="Find city..."]').attr('id','namesearch');

在我找到数据类型之前,它正在将 id 应用于所有具有数据类型 =search 的字段。

于 2013-09-02T05:35:23.810 回答