1

我正在尝试使用 Jquery 和 JavaScript 自动填充选择框。

我进行了一些搜索并遇到了这个问题并遵循了所选答案的建议。

我最初设置了一个 jsFiddle 来说明我的问题:http: //jsfiddle.net/GJdBR/

在收到关于以下答案的一些建议后,我创建了一个新的 jsfiddle 并且它起作用了。http://jsfiddle.net/2UbqP/

但是,在我的计算机上,我使用的是全新安装的 Windows 7,到目前为止,我所做的只是安装 chrome、apanta 和 xampp。我去 localhost/website 并且该站点出现了,但是 js 功能不起作用,即使我证明代码是正确的,因为上面的 jsfiddle,选择框也没有填充 var。

我收到一个错误:

$(document).ready(function() {
    populateTranslationOptions();
});

错误内容如下:

Uncaught SyntaxError: Unexpected token ILLEGAL
4

3 回答 3

1
$.each(translationOptions, function (index, value) {   
        $('#translationOptions')
            .append($("<option></option>")
            .attr("value",value)
            .text(value)); 
    });

你试过了

$.each(translationOptions, (value) )

这是错误的,因为正确的结构是$.each(mapData, callbackFunction),这里mapData是指对象或数组。

下一个问题是:

 $(document).ready(function() {
   populateTranslationOptions;
 });​

它应该

$(document).ready(function() {
   populateTranslationOptions(); // you missed () here
 });​

请注意,populateTranslationOptions不调用函数,因此要调用函数,您需要populateTranslationOptions().

演示

一个重要的注意事项

函数后面的 () 表示执行函数本身并返回它的值。没有它,您只需拥有该函数,该函数可用于作为回调传递。

相关参考:

于 2012-06-03T18:21:13.943 回答
1

您的代码中有几个问题。检查这个

function populateTranslationOptions ()
{
    var translationOptions = ["Egyptian Hieroglyphs", "Al Bhed (Final Fantasy X)", "Futurama"];
    $.each(translationOptions ,function(i,value) {   
        $('#translationOptions')
            .append($("<option></option>")
            .attr("value",value)
            .text(value)); 
    });
}

$(document).ready(function() {
   populateTranslationOptions();
 });​

您的代码中的问题:

  • $.each语法错误

    $.each(translationOptions (value)) {

应该

$.each(translationOptions ,function(i,value) {
  • 你没有调用函数populateTranslationOptions;不会调用函数 populateTranslationOptions();

工作小提琴

于 2012-06-03T18:21:20.130 回答
1

对于数组, $.each 是不必要的。您可以使用简单的循环。如下-

function populateTranslationOptions()
{
    var translationOptions = ["Egyptian Hieroglyphs", "Al Bhed (Final Fantasy X)", "Futurama"];
    for (var i = 0; i < translationOptions.length; i++) {
        $('#translationOptions')
            .append('<option value="' + translationOptions[i] + '">' + translationOptions[i] + '</option>');
    };
}

$(document).ready(function() {

   populateTranslationOptions();
 });​
于 2012-06-03T18:29:58.777 回答