如何在phonegap android中动态应用id表单

how to apply the id to form dynamically in phonegap android?

本文关键字:动态 应用 id 表单 android phonegap      更新时间:2023-09-26

我正在创建一个应用程序,在该应用程序中我使用了一个自动完成视图,该列表是在js文件中动态创建的。我想知道的是,如果我创建了多个我想应用的自动complete,并将不同的id应用到由jquery移动自动Complete创建的输入类型="search"。我试图将id应用到输入字段,但实际情况是,它将sane id应用到role="earch"的所有输入字段。但我想给role='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');
    });
});});

这是创建的html代码ul:

<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>

在问这个问题之前,我没有发现对的一个简单更改。我只是更改代码形式:

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

到此:

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

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