Question

这是我的rails应用程序中的jquery UI自动完成功能。在一个javascript文件中，我有一个包含所有美国州名称的对象数组，如此。

var allStates = [
{
    "name": "Alabama",
    "abbreviation": "AL"
},
{
    "name": "Alaska",
    "abbreviation": "AK"
},
];

这是我的javsacript函数。最初我在不同的JS文件中有这些，但即使把它放在所有对象下的同一文件的底部也行不通。这些函数的目标是将状态的所有名称从对象数组转换为数组，如var statesarray = [“Alabama”，“Alaska”];

var statesArray = [];
$(document).on('ready page:load', function(){
function singArray() {
    for (var i = 0; i <allStates.length; i ++) {
        statesArray.push(allStates[i].name);
    }
    return statesArray;
}
})

function updateStateSearch() {
$("#state-field").autocomplete({
        source: statesArray
    });
}

然而，当我加载我的页面时，所有值都转换为数组（它需要由jquery UI使用的形式）似乎不起作用。例如，我知道它不是因为当我加载页面并输入类似statesArray.length;之类的东西时，返回的值为0，即使它们都应该在页面加载时被推送到该数组。

注意：自动完成的updateStateSearch函数在此事件上执行：

     <%= f.text_field :state, :id => "state-field", :onkeydown=>"updateStateSearch()" %>

坦率地说 - 为什么我的代码不起作用？

Answer 1

在页面加载时，您只是定义了未在任何地方调用的函数singArray。如果您希望在页面加载时加载数组，只需删除singArray的定义：

$(document).on('ready page:load', function(){
    for (var i = 0; i <allStates.length; i ++) {
        statesArray.push(allStates[i].name);
    }
});

如果你想在页面加载后的其他时间填充数组，请在那里调用singArray - 例如：

function updateStateSearch() {
    $("#state-field").autocomplete({
        source: singArray();
    });
}

Answer 2

您需要调用singArray()函数才能在某处填写数组。

$(document).on('ready', function() {
  var statesArray = [];

  function singArray() {
    for (var i = 0; i < allStates.length; i++) {
      statesArray.push(allStates[i].name);
    }
    return statesArray;
  }

  singArray();

  function updateStateSearch() {
    $("#state-field").autocomplete({
      source: statesArray
    });
  }
});

Jquery：代码未在rails中的页面加载时执行

2 个答案: