使用 jQuery,我需要根据下拉列表捕获 var 信息 - id 等于 var name

using jQuery, I need to capture var info based on dropdown - id equals var name

不确定我是否需要使用 id 来完成此任务

<select id="selectedCity" data-native-menu="false" onchange="location = this.options[this.selectedIndex].value;">
  <option value="#">-- Select City --</option>
  <option id="Atla" value="#tiera">Atlanta</option>
  <option id="Aust" value="#tierc">Austin</option>
  <option id="Balt" value="#tiera">Baltimore</option>
  <option id="Bost" value="#tierb">Boston</option>
</select>

我正在尝试捕获下面的变量信息,但我需要它来匹配用户通过下拉列表选择的城市,然后我需要变量信息来用所选的变量信息填充同一页面上的所有页面.

  var Atla = "info on Atlanta"
  var Aust = "info on Austin"
  var Balt = "info on Baltimore"
  var Bost = "info on Boston"

if id Atla = var Atla
    $("p").text(Atla);

else if id Aust = var Atla
    $("p").text(Aust);

else if...

制作一个包含字幕的对象可能更容易,然后让每个 option 都有一个带有适当键的自定义 data-* 属性:

新选项:

<select id="selectedCity" data-native-menu="false" onchange="location = this.options[this.selectedIndex].value;">
  <option value="#">-- Select City --</option>
  <option data-desc="Atla" value="#tiera">Atlanta</option>
  <option data-desc="Aust" value="#tierc">Austin</option>
  <option data-desc="Balt" value="#tiera">Baltimore</option>
  <option data-desc="Bost" value="#tierb">Boston</option>
</select>

JS:

var descriptions = {
    Atla: "info on Atlanta",
    Aust: "info on Austin",
    Balt: "info on Baltimore",
    Bost: "info on Boston"
}

$("#selectedCity").change(function() {
    var desc = descriptions[$("option:selected", this).data("desc")];
    $("p").text(desc);
});

演示:http://jsfiddle.net/4mtcu8md/