代码之家  ›  专栏  ›  技术社区  ›  Dodinas

jquery/以编程方式在选择框中选择一个选项

  •  45
  • Dodinas  · 技术社区  · 15 年前

    我目前正在使用jquery返回一些JSON结果。返回这些结果后,我将使用它们在表单中预先填充字段。

    但是,在下拉框中预先选择项目时,我需要一些帮助。例如,我有一个选择框(它被缩短了):

    <select id="startTime">
    <option value="14:00:00">2:00 pm</option>
    <option value="15:00:00">3:00 pm</option>
    <option value="16:00:00">4:00 pm</option>
    <option value="17:00:00">5:00 pm</option>
    <option value="18:00:00">6:00 pm</option>
    </select>
    

    如果我的json值是:

     var start_time = data[0].start  // Let's say this is '17:00:00'
    

    如何使用jquery选择值为“17:00:00”的选项?

     <option value="17:00:00" selected="selected">5:00 pm</option>
    
    8 回复  |  直到 6 年前
        1
  •  78
  •   Sam Hasler    8 年前

    更新:

    自jquery 1.9起,jquery已更新并更改了此功能。选项的“selected”状态实际上是一个属性,因此jquery已将其更改为使用.prop()方法。语法非常相似,并且易于切换:

    $('#startTime option[value=17:00:00]').prop('selected', true);
    

    http://api.jquery.com/prop/#entry-longdesc 为什么要通过 true .


    老jQuery

    $('#startTime option[value=17:00:00]').attr('selected', 'selected');
    

    $('#startTime option[value='+ data[0].start +']').attr('selected', 'selected');
    
        2
  •  33
  •   Corey Ballou    15 年前
    $('#startTime').val(start_time);
    
        3
  •  10
  •   Jacob Mattison    15 年前

    只是 $("#startTime").val(start_time);

        4
  •  10
  •   Joshua    11 年前

    更新

    自jquery 1.9起,jquery已更新并更改了此功能。选项的“selected”状态实际上是一个属性,因此jquery已将其更改为使用.prop()方法。语法非常相似,并且易于切换:

    $('option[value=17:00:00]').prop('selected', 'selected');
    
        5
  •  2
  •   John Thompson    11 年前

    jquery移动用户的其他信息(1.3.0):

    这里有一个 similar example .

    如果使用jquery 1.9.1和jquery mobile 1.3.0尝试上述示例,则可以看到,除非添加

    $("#location_list").selectmenu("refresh");
    

    在使用jquery Mobile时请记住这一点。它让我很头疼

        6
  •  1
  •   animuson    13 年前

    出于某种原因,它的工作方式如下:

    $('#startTime').val(''+data[0].start+'');
    
        7
  •  1
  •   antoshib    10 年前
    var varValue="17:00:00";
    $("#startTime").ready(function(){ 
       $("#startTime option[value='"+varValue+"']").prop("selected", "selected"); });
    

    在jquery 1.10上为我工作

        8
  •  0
  •   sh497    6 年前

    $('#startTime').val(start_time);

    如果要在选择选项后触发所选更改事件:

    $('#startTime').trigger("change");