顯示下拉菜單中的XML項目

Question

我一直在爲我的工作開發一個小工具，但無法真正獲得最後的工作。

你可以看到代碼等在這裏：http://jsfiddle.net/wb157kbx/5/

我想要做的是，我想從XML的country到下拉列表中，因爲它已經是。當您選擇country時，它會在#tal標記中顯示來自XML的mobile，phone和code數據。我使用JQuery來完成這一切。

我做錯了什麼，因爲我沒有得到所選的price，phone,code等？

DEMO

Answer 1

$('#dropdown').change(function() {  

    $selected = $('#dropdown').find(":selected"); 
    var id = $selected.prop("id"); 
     $(xml).find('item[id="' + id + '"]').each(function ({ 

      var code = $(this).find('code').text(); 
      var fastnet = $(this).find('phone').text(); 
      var mobil = $(this).find('mobile').text(); 

     $("#pris").text("Mobil: " + mobil + " Fastnet: " + fastnet + " Landkode: " + code); 

}); 

的問題是，你過早的值添加到全局作用域的ID。 這樣你的id就會成爲xml上的最後一個id。

您需要解決所選擇的選項ID

var id = $selected.prop("id"); 

什麼，我會做的是：

success: function (xml) { 

      // Parse the xml file and get data 
      var xmlDoc = $.parseXML(xml),     
       $xml = $(xmlDoc), 
       options = ""; 


      $(xml).find('item').each(function() { 
       id = $(this).attr('id'); 
       land = $(this).find('country').text(); 
       code = $(this).find('code').text(); 
       fastnet = $(this).find('phone').text(); 
       mobil = $(this).find('mobile').text(); 

       options += "<option data-id='"+id +"' data-land='"+land +"' data-code='"+code +"' data-fastnet='"+fastnet +"' data-mobil='"+mobil+"' >" + land + "</option>"; 

      }); 
      $("#dropdown").html(options) 

     } 

，然後改變我這樣做：

$('#dropdown').change(function() {  
    $selected = $('#dropdown').find(":selected"); 
    $("#pris").text("Mobil: " +$selected.data("mobil")+ 
        " Fastnet: " +$selected.data("fastnet") + 
        " Landkode: " + $selected.data("code")); 

});