Javascript 无法使用jquery设置选择的值

Javascript 无法使用jquery设置选择的值,javascript,jquery,html,html-select,Javascript,Jquery,Html,Html Select,这是我的html代码 <select id="ddlCountry" placeholder="optional" class="select" title="Select Country"> <option value="0">Select Country</option> </select> 选择国家 这是jquery代码 $(document).ready(function () { $('select.select').eac

这是我的html代码

<select id="ddlCountry" placeholder="optional" class="select" title="Select Country">
 <option value="0">Select Country</option>
</select>

选择国家
这是jquery代码

$(document).ready(function () {

  $('select.select').each(function () {
    var title = $(this).attr('title');
    if ($('option:selected', this).val() != '') {
      title = $('option:selected', this).text();
      $(this)
        .css({
          'z-index': 10,
          'opacity': 0,
          '-khtml-appearance': 'none'
        })
        .after('<span class="select">' + title + '</span>')
        .change(function () {
          val = $('option:selected', this).text();
          $(this).next().text(val);
        })
    }
  });


  var country = [{
    "CountryID": 1,
    "CountryName": "Afghanistan"
  }, {
    "CountryID": 2,
    "CountryName": "Albania"
  }, {
    "CountryID": 3,
    "CountryName": "Algeria"
  }, {
    "CountryID": 4,
    "CountryName": "American Samoa"
  }, {
    "CountryID": 5,
    "CountryName": "Andorra"
  }, {
    "CountryID": 6,
    "CountryName": "Angola"
  }, {
    "CountryID": 7,
    "CountryName": "Anguilla"
  }, {
    "CountryID": 8,
    "CountryName": "Antarctica"
  }, {
    "CountryID": 9,
    "CountryName": "Antigua and Barbuda"
  }, {
    "CountryID": 10,
    "CountryName": "Argentina"
  }];

  $.each(country, function (index, item) {
    $('#ddlCountry').append($('<option></option>').val(item.CountryID).html(item.CountryName));
  });

  $('#ddlCountry').val(2);
});
$(文档).ready(函数(){
$('select.select')。每个(函数(){
var title=$(this.attr('title');
如果($('option:selected',this).val()!=''){
title=$('option:selected',this).text();
$(本)
.css({
“z指数”:10,
“不透明度”:0,
“-khtml外观”:“无”
})
.之后(“”+标题+“”)
.改变(功能){
val=$('option:selected',this).text();
$(this.next().text(val);
})
}
});
var国家=[{
“CountryID”:1,
“国家名称”:“阿富汗”
}, {
“CountryID”:2,
“国家名称”:“阿尔巴尼亚”
}, {
“CountryID”:3,
“国家名称”:“阿尔及利亚”
}, {
“CountryID”:4,
“国家名称”:“美属萨摩亚”
}, {
“CountryID”:5,
“国家名称”:“安道尔”
}, {
“CountryID”:6,
“国家名称”:“安哥拉”
}, {
“CountryID”:7,
“国家名称”:“安圭拉”
}, {
“CountryID”:8,
“国家名称”:“南极洲”
}, {
“CountryID”:9,
“国家名称”:“安提瓜和巴布达”
}, {
“CountryID”:10,
“国家名称”:“阿根廷”
}];
美元。每个(国家、职能(索引、项目){
$('#ddlCountry').append($('').val(item.CountryID.html(item.CountryName));
});
$(#ddlCountry').val(2);
});
我已在ready中将下拉值设置为2,但默认值始终为
选择国家

这是你的建议试试这个

$("#ddlCountry")[0].selectedIndex = 2;
而不是

$('#ddlCountry').val(2);

以编程方式更改select的选定值时,不会触发onchange事件。手动触发它:

$('#ddlCountry').val(2).change();

您可以将
。每个
函数放在要将值设置为
2的行下方,方法如下:

 $('#ddlCountry').val(2); //<---below this one

  $('select.select').each(function () {
    var title = $(this).attr('title');
    if ($('option:selected', this).val() != '') {
      title = $('option:selected', this).text();
      $(this)
        .css({
          'z-index': 10,
          'opacity': 0,
          '-khtml-appearance': 'none'
        })
        .after('<span class="select">' + title + '</span>')
        .change(function () {
          val = $('option:selected', this).text();
          $(this).next().text(val);
        })
    }
  });

$('ddlCountry').val(2)// 设置该值不会触发
更改
事件

您可以添加:

$('#ddlCountry').val(2).trigger('change');

问题是什么?刚刚发布了答案。