包括一个搜索框，该搜索框可以查看JSON并返回下拉列表

Include a search box that can look through a JSON and return drop down list

本文关键字：搜索 JSON 返回 下拉列表 包括一      更新时间：2023-09-26

我正在使用一个JSON文件来填充各种转换的一些下拉菜单。转换器有所增长，我希望可以选择包括一个搜索栏。

因此，用户可以搜索毫安，而不是导航到"电力"等中的"电流"类别。我只想让他们更容易一点。

我的JSON只有两个字段，下拉列表的名称和值，示例如下。这个值是一个字符串，按照我所理解的方式，毫安就是毫安，其他各种都使用骆驼格。我认为不适合在此字段上运行搜索，因为值可能与名称不同。

这个例子中的名称字段是毫安（mA），所以我需要搜索能够查看字符串的一部分，而不是忽略大小写进行完全匹配，因为搜索字符串可能是毫安或毫安，甚至毫安。

从那里开始，下一步要么在该页面上填充下拉列表，要么返回可能的选项列表（如果有很多）。

这可能吗？如果可能的话，你能指引我朝正确的方向走吗？

非常感谢！

    "current":[
    {
        "value" : "ampere",
        "name" : "Ampere(A)"
    },
    {
        "value" : "kiloAmpere",
        "name" : "Kiloampere(kA)"
    }]

您可以使用这个JS-lib-DefiantJS（defianjs.com），它用一种新方法扩展了全局对象JSON："search"。使用此方法，您可以使用XPath表达式搜索JSON结构，如下所示：

var data = {
       "current": [
          { "value": "ampere",      "name": "Ampere(A)" },
          { "value": "kiloAmpere",  "name": "Kiloampere(kA)" },
          { "value": "milliAmpere", "name": "milliAmpere" },
          { "value": "Milliampere", "name": "Milliampere" }
       ]
    },
    res = JSON.search( data, '//name[contains(translate(., "MA", "ma"), "millia")]/..' );
console.log( res[0].name );
console.log( res[1].name );

表达式中的"translate"方法将搜索范围扩展到包括字母"ma"的大小写版本。如果你想覆盖所有的字母，那么把它们全部加起来。

这是一把正在工作的小提琴
http://jsfiddle.net/hbi99/6ssS9/

相关文章：