使用AJAX在JSON中搜索

Question

我必须用我输入的值在一个json文件中进行搜索，捕获这个值和事件没什么问题，但是当我迭代的时候发生了一些意想不到的事情。如何根据此搜索选择对象？问题是，当执行.each时，它会遍历所有记录，甚至是那些找不到的记录。

$( document ).on('turbolinks:load', common_events)

function common_events(){
    $('.rut-input').on('change', function(event){
        $rut = $(this).val();
        var searchField = $rut;
        var expression = new RegExp(searchField, "i");
        event.preventDefault();
        $.ajax({
            type: "GET",
            url: '/companies/',
            dataType: 'JSON',
            success: function(companies){
                $.each(companies, function(i, company) {
                    if (company.rut.search(expression) > -1){
                        console.log(company.id);

                        $('.name-input').empty();
                        $('.name-input').val(company.name);
                        $('.name-input').addClass('disabled-input');
                        $('.form-group').removeClass('hide');
                        console.log(company.address);
                        if (company.address == null ){
                            $('.address-input').removeClass('disabled-input');
                        };
                    }
                    else {
                        console.log('no encuentra');
                        console.log(company);
                        $('.form-group').removeClass('hide');
                        $('.form-control').removeClass('disabled-input');
                    };
                });
            },
            error: function(companies){
                console.log('A ocurrido un error')
            },
        });
    });
}

在执行事件时，if和else都会同时执行。

Answer 1

看起来您并不是真的想对每个对象迭代companies数组。您希望找到一家匹配的公司，然后对该记录执行一些操作。

success: function(companies){
    const company = companies.find(c => c.rut.search(expression) > -1);
    
    if (company) {
        console.log(company.id);

        $('.name-input').empty();
        $('.name-input').val(company.name);
        $('.name-input').addClass('disabled-input');
        $('.form-group').removeClass('hide');
        console.log(company.address);
        if (company.address == null ){
            $('.address-input').removeClass('disabled-input');
        }
    } else {
        console.log('no encuentra');
        console.log(company);
        $('.form-group').removeClass('hide');
        $('.form-control').removeClass('disabled-input');
    }
},