1

我在这里阅读了多篇关于数组、.each 和其他解决方案的文章，但没有一篇文章向我展示了我正在尝试做的事情。

我想让它到达单击按钮的位置，存储该按钮的值，然后与数组中对象的值进行比较。如果找到匹配项，我希望将该匹配项 .append 附加到页面的一部分中。

我知道按钮点击正在注册。我已将其附加到页面中并显示了正确的值。我知道我可以使用 .each 和 .append 迭代数组中的所有对象，因为我也这样做了。但是，如果我只是从下面的示例中 .append employee 我得到 [object Object] ，因此我知道我的比较运算符无法正常工作。非常感谢向我展示我的问题或解释它为什么不起作用的任何帮助。

这是按钮：

<button type="button" id="german" class="searchButton" value="German">German</button>

这就是我的数组的一行

employees = [
{ "firstName":"Alex",    "lastName":"Hagerman",  "language":"German",    "department":"Nuerology",   "position":"Nurse",         "skill":"Infection" },
]

还有更多行，但这适用于示例。

这是我想将按钮值与数组值进行比较的函数。（如果我只是在这里添加员工，我会得到 [object Object]）

$(document).ready(function(){
    $('button').click(function(){
        var buttonValue = $(this).val();
        $.each(employees, function (i, employee) {
                if (employee == buttonValue) {
                    $('#resultsView').append('<div class="searchResults">'+employee.firstName+employee.lastName+'<br />'+employee.language+'<br />'+employee.department+employee.position+'<br />'+employee.skill+'</div>');
            }
                else {
                    $('#resultsView').append('<div id="resultsView" class="noResult">No results found</div>');
                }

        });
    });
});

目前我只得到没有找到结果。

4

5 回答 5

2

您遇到了一些问题 - 第一个是您试图将原始对象与按钮值进行比较：(employee == buttonValue). 相反，您需要与您正在寻找的任何内容进行比较，即语言employee.language == buttonValue

第二个是如果数组中的任何对象不匹配，它将追加no results. 这可以通过设置一个标志来指示是否找到结果来解决 - 在.each循环之外制作标志并设置为 false - 如果找到结果，则将标志设置为 true。循环后.each检查是否设置了结果 - 如果没有，则不显示任何结果。

这是一个有效的解决方案。

$('button').click(function(){
    var but = this;
    var results = false;
    $.each(employees, function(index, employee){
        if(employee.language == but.value)
        {
            results = true;
            $('#resultsView').append('<div class="searchResults">' + employee.firstName + employee.lastName + '<br />' + employee.language + '<br />' + employee.department + employee.position + '<br />' + employee.skill + '</div>');
        }
    });
    if(!results)
    {
        $('#resultsView').append('<div id="resultsView" class="noResult">No results found</div>');
    }
});
于 2013-01-04T16:01:21.320 回答
1

如果要将按钮值与员工语言值进行比较，则需要更改if statement如下：

改变：

if (employee == buttonValue) {

到：

if (employee.language == buttonValue) {

工作示例：http: //jsfiddle.net/fewds/7MYED/

于 2013-01-04T15:56:54.930 回答
1

首先，您检查的是整个员工对象，而不是员工对象中的给定值。

其次，如果员工与按钮值不匹配，您的“未找到”逻辑将打印出来，因此我将其移至整个搜索的末尾。

    $(function(){
        $('button').click(function(){
            var buttonValue = $(this).val(), totalFinds = 0;
            $.each(employees, function (i, employee) {
              var isFound=false;
              $.each(employee, function(key,value){
               //remove the 'key' check if it does not make sense for your needs
                if(key == buttonValue || value == buttonValue){
                  isFound = true;
                }
              }); //end employee loop
              if(isFound){
                $('#resultsView').append('<div class="searchResults">'+employee.firstName+employee.lastName+'<br />'+employee.language+'<br />'+employee.department+employee.position+'<br />'+employee.skill+'</div>');
                totalFinds += 1;
              }  
            });// end employees loop
            if(totalFinds ===0){
              $('#resultsView').append('<div id="resultsView" class="noResult">No results found</div>');
            }
        }); //end .click()

    });//end .ready()
于 2013-01-04T15:57:58.810 回答
0

Employee 是一个键值对（即）一个对象......而您正在尝试将一个对象与一个变量值进行比较......所以它不起作用......

尝试获取您需要比较的值...只需尝试使用“。”从对象中获取值。操作员...说员工.名字...

然后进行比较......它会工作......

于 2013-01-04T16:01:48.070 回答
0

您可以改用$.grep()来获取所有匹配的结果。如果有元素，则循环并追加元素。如果没有结果，则追加

$(document).ready(function() {
    $('button').click(function() {
        var buttonValue = $(this).val();
        var results = $.grep(employees, function(data) {
            return data.language == buttonValue; // return objects that have language = to button value
        })
        if (results.length > 0) { // if 1 or more results loop through and print
            $.each(results, function(i, employee) {
                $('#resultsView').append('<div class="searchResults">' + employee.firstName + employee.lastName + '<br />' + employee.language + '<br />' + employee.department + employee.position + '<br />' + employee.skill + '</div>');
            })
        } else { // else append no results found
            $('#resultsView').append('<div id="resultsView" class="noResult">No results found</div>');
        }
    });
});​

因为由于您正在遍历数组，所以即使您可能在数组中找到至少一个匹配的对象，当它不匹配时您也会附加 No Results

JSFIDDLE

于 2013-01-04T16:05:19.027 回答