0

我有一个带有选择框的表单，如下所示：

 <select id="school">
   <option>Choose school</option>
   <option value="656462">test</option>
   <option value="653671">test1</option>
   <option value="653688">test2</option>        
 </select>

如何从上述选项中获取选项值？我想使用下面的 jQuery 代码中的值：

 $("select#school").change(function(){

    $("select#locatie").html('<option value="">Course</option>');
    $("select#lijst").html('<option value="">List</option>');

    $("#cat1").html($("#school option:selected").text());
    $("#cat2").html('Course');
    $("#cat3").html('List');

    var options = '';
    $(function(){
      $("select#school").change(function(){

        $("select#location").html('<option value="">Location</option>');
        $("select#list").html('<option value="">List</option>');

        $("#cat1").html($("#school option:selected").text());
        $("#cat2").html('Course');
        $("#cat3").html('List');

        var options = '';


        if($("#school").val() == 656462){   
            options += '<option value="">Course</option>';
            options += '<option value="12345">test1</option>';   
        }  
        if($("#school").val() == 653671){   
            options += '<option value="">Course</option>';
            options += '<option value="89887">test2</option>';   
        }
        if($("#school").val() == 653688){   
            options += '<option value="">Course</option>';
            options += '<option value="548798">test25</option>';   
        }              

        $("select#locatie").html(options);

  });
});

基本上，对于每个选项值，都有一个新的 if 语句。问题是选择框充满了许多自动生成的选项值。所以现在我必须手动完成所有事情，而不是自动生成 if 语句。

所以我尝试做的是：1）从 2）获取所有选项值）使用这些选项值为每个值创建一个 if 语句

非常感谢任何帮助

4

2 回答 2

2

如果我了解您要做什么，您想根据第一次选择的结果为第二次选择创建新选项吗？我可能会将可能的选项存储在对象的数组中：

var courseSelection = {
    "656462": [ { value: "123456", text: "Course 1" }, { value: "234567", text: "Course 2" } ],
    "653671": [ { value: "345678", text: "Course 3" }, { value: "456789", text: "Course 4" } ],
    "653688": [ { value: "567890", text: "Course 5" }, { value: "678901", text: "Course 6" } ]
};

然后在您的更改事件处理程序中，（如您所说）您可以遍历数组中的每个对象以构建适当的列表：

$("select#school").change(function(){

    var options = '',
        courses = courseSelection[$(this).val()];

    $('select#course').empty();

    options += '<option value="">Course</option>';

    $.each(courses, function() {
        options += '<option value="' + this.value + '">' + this.text + '</option>';
     });

    $('select#course').append(options).show();

});

JSFiddle描述了我的意思。让我知道我是否在这里搞错了！

于 2013-10-15T13:31:11.120 回答
0

重新考虑你的方法。在这种情况下，我将执行以下操作之一：

  1. 在#schoolchange事件中将选择的值发送到服务器以获取匹配选项列表；或者
  2. 如果您想在客户端完成所有操作，请创建一个数组，为每个可能的值提供匹配的选项。这样你就可以避免所有这些丑陋if的陈述。
于 2013-10-15T13:40:04.890 回答