Question

我正在尝试使用jQuery解析和搜索我的json文件，我能够解析json文件但不能搜索它。

我的HTML

<ol id="results"></ol>

我的jQuery

$(document).ready(function() {
    $.getJSON('myJson.json', function(data) {
        $.each(data, function(i, item) {
            $('<li />').html(item.name + '<br>' + item.details + '<br>').appendTo('#results');
        }
    });
});

上面的代码返回所有项目，但我现在希望允许用户搜索json文件，所以我包含一个表单输入并创建一个onclick事件并将输入传递给搜索，请参阅下面的链接。

问题是输入变量是不是传递给了搜索？请帮忙。

http://jsfiddle.net/xpTk5/7/

更新：将变量传递给正则表达式似乎是个问题。

解决：if (item.name.search(new RegExp(q, "i")) != -1){

感谢您的尝试并抱歉浪费您的时间。

Answer 1

您需要在提交表单后获取文本框的值。你拥有它的地方，它永远不会被设置，因为它在文档准备就绪时获得了值（并且可能在输入任何内容之前）。

$(document).ready(function() {
    $('#submit').click(function() {
        var q = $('#query').val();
        $.getJSON('myJson.json', function(data) {
            // iterator
            $.each(data, function(i, item) {
                // search the results using regular expression for the query
                if (item.name.search(new RegExp(/''+q+''/i)) != -1) {
                    $('<li />').html(item.name + '<br>' + item.details + '<br>').appendTo('#results');
                }
            });
        });
    });
});

Answer 2

正则表达式正在读取变量。

$('#submit').click(function() {
    var q = $('#query').val();
    $.getJSON('myJson.json', function(data) {
        // iterator
        $.each(data, function(i, item) {
            // search the results using regular expression for the query
            if (item.name.search(new RegExp(q, "i")) != -1) {
                $('<li />').html(item.name + '<br>' + item.details + '<br>').appendTo('#results');
            }
        });
    });
});

http://jsfiddle.net/xpTk5/8/

使用jQuery搜索JSON

2 个答案: