Question

我如何使用json文件中的自动完成功能创建搜索，并在提交值后显示结果在新页面中显示有值的数据

这是html文件：

<form action="/dosomething">
<input/>
<button type="submit"></button>
</form>

我的json文件：

    [
        {
           "title": "Stackoverflowsite1",
           "link": "www.stackoverflow.com"
        },
        {
           "title": "Stackoverflowsite2",
           "link": "www.stackoverflow2.com"
        },
        {
           "title": "Stackoverflowsite3",
           "link": "www.stackoverflow3.com"
        }
   ]

如何解析自动完成的数据并在执行此操作后显示结果？请帮助，谢谢！

Answer 1

表格将提交您所指示的任何行动。因此，只需在您要填充的字段上调用自动填充，定义数据，就应该参加比赛。

<form action="/dosomething">
    <input id="fillme" />
    <button type="submit"></button>
</form>



var sourceJSON =  [
        {
           "title": "Stackoverflowsite1",
           "link": "www.stackoverflow.com"
        },
        {
           "title": "Stackoverflowsite2",
           "link": "www.stackoverflow2.com"
        },
        {
           "title": "Stackoverflowsite3",
           "link": "www.stackoverflow3.com"
        }
   ]

$( "#fillme" ).autocomplete({
      minLength: 0,
      source: sourceJSON,
      focus: function( event, ui ) {
        $( "#fillme" ).val( ui.item.title );
        return false;
      },
      select: function( event, ui ) {
        $( "#fillme" ).val( ui.item.title );

        return false;
      }
    }).autocomplete( "instance" )._renderItem = function( ul, item ) {
  return $( "<li>" )
    .append( "<a>" + item.title+ "</a>" )
    .appendTo( ul );
};

自动完成Jquery，并显示结果

1 个答案: