如何使用jQuery将选定值设置为多个选择输入？

Question

如何使用jQuery将选定值设置为多个选择输入？

3

我有两个选择输入框，我用年份数组填充它们。之后，我想将currentYear设置为每个Select的选定值。我有这段代码，但只适用于第一个Select，我不明白为什么。

在jQuery 1.4.3中一切都很好，而1.4.2失败了:_(

我正在尝试这个，但没有成功：-(只有第一个选择框的选定值是正确的。版本可能存在问题吗？IE6，asp.net 2.0，jquery 1.4.2。例如，"$(sinceComboSelector).val(currentYear);"不起作用，我必须执行"$ ('#cmbAnyDesde option [value =' + currentYear + ']'). attr('selected'，'selected');" :-(

代码已更新：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Tests.aspx.cs" Inherits="Tests" %>
    
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
<html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script src="../JAVASCRIPT/jquery-1.4.2.min.js" type="text/javascript"></script>
    </head>
    <body>
        <script type="text/javascript">
            $(document).ready(function() {
                loadYears();
            });
            var loadYears = function() {
                var currentYear = new Date().getFullYear(),
                    years = [],
                    firstYear = currentYear - 7,
                    lastYear = currentYear + 3,
                    sinceComboSelector = "#cmbAnyDesde",
                    toComboSelector = "#cmbAnyHasta",
                    i;
    
                for (i = firstYear; i <= lastYear; i++) {
                    years.push(i);
                }
    
                $(sinceComboSelector).find('option').remove();
    
                $(toComboSelector).find('option').remove();
    
                $.each(years, function(key, value) {
                    $(sinceComboSelector)
                      .append($("<option></option>")
                      .attr("value", value)
                      .text(value));
    
                    $(toComboSelector)
                      .append($("<option></option>")
                      .attr("value", value)
                      .text(value)); ;
                });
    
    //            $(sinceComboSelector).val(currentYear);
    //            $(toComboSelector).val(currentYear);
                $('#cmbAnyDesde option[value=' + currentYear + ']').attr('selected', 'selected');            
                $('#cmbAnyHasta option[value=' + currentYear + ']').attr('selected', 'selected');
            }; 
        </script>
        <form id="form1" runat="server">
        <div>
            <select id="cmbAnyDesde" style="width:70px"></select>
            <select id="cmbAnyHasta" style="width:70px"></select>
        </div>
        </form>
    </body>
</html>

- rubdottocom

1

我不确定你的问题是什么，但请注意 if ($('#cmbAnyHasta)) { 总是会通过。请使用 $('#cmbAnyHasta').length 代替。 - lonesomeday

1

页面上是否有任何 JavaScript 错误，可能会给出为什么它不起作用的线索？如果我只是将您的 JavaScript 放入一个带有正确 ID 的测试页面中，那么它似乎完美地工作：http://jsfiddle.net/XmPas/。显然问题在您粘贴的内容之外。也许剪切页面的一些部分以尝试形成最小测试案例。很有可能您剪切的某些部分会使其开始工作，然后您可以找出原因（或者提供更多信息向我们询问）。 - Chris

哇！我不知道有Fiddle这个工具，我用不同的jQuery版本进行测试，发现1.4.2失败了，但1.4.3表现很好。非常感谢！ - rubdottocom

任何以另一个人知道JSFiddle结束的问题都是一个好问题。;-) - Chris

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- szanata · Answer 1

我在这里测试了上面的代码，它可以正常工作：

$(document).ready(function (){

  loadYears();

});

var loadYears = function () {
  var currentYear = new Date().getFullYear(),
    years = [],
    firstYear = currentYear - 7,
    lastYear = currentYear + 3,
    sinceComboSelector = "#cmbAnyDesde",
    toComboSelector = "#cmbAnyHasta",
    i;

  for (i = firstYear; i <= lastYear; i++){
    years.push(i);
  }

  $(sinceComboSelector).find('option').remove();

  $(toComboSelector).find('option').remove();

  $.each(years, function(key, value) {
    $(sinceComboSelector)
      .append($("<option></option>")
      .attr("value", value)
      .text(value));

    $(toComboSelector)
      .append($("<option></option>")
      .attr("value", value)
      .text(value)); ;
  });

  $(sinceComboSelector).val(currentYear);
  $(toComboSelector).val(currentYear);
};