使用jQuery時，數據來自XML

Question

設置在tinyMCE的內容我有一個下拉菜單，對這種變化，我需要設置內容TinyMCE的編輯，我需要弄清楚如何比較選擇的選項下拉列表和XML標記，以便我可以設置值。

這裏是我到目前爲止所。

http://jsfiddle.net/S6Eqq/25/

不知道是否有更好的方式來實現這一目標。

Answer 1

如果它可以幫助你，你應該得到像你下拉框的值：

value = $('#country option:selected').val(); 

而且你的代碼...

var xml = '<xmlroot><nodes><id>US</id><desc>I am in the USA Description</desc></nodes><nodes><id>FR</id><desc>I am in the French Description</desc></nodes><nodes><id>ES</id><desc>I am in the Spain Description</desc></nodes></xmlroot>'; 


$(function() { 
    tinyMCE.init({ 
     mode:'textareas' 
    }); 

    $("#country").change(function() { 
     loadText(); 
    }); 

    function loadText() { 
     //In this example you fetch them from the var xml. Later on you can fetch them through a get() function. 
     //$.get('file.xml',{}, function(xml) { 
     var value = $("#country option:selected").val(); 
      $('nodes',xml).each(function() { 
       //Get id of selected XML node 
       id = $(this).find("id").text(); 
       //Get description of selected XML node 
       desc = $(this).find("desc").text(); 
       if (value != "") { 
        if (id.toLowerCase() == value.toLowerCase()) { 
         tinyMCE.activeEditor.setContent(desc); 
        } 
       } 
      }); 

     //}); 
    } 
}); 

所以基本上你不需要取當下拉框的change()事件被觸發時的值。

你可以簡單地通過利用$('#country option:selected').val();訪問您function loadText()方法選擇的值。

所以：

var value = $('#country option:selected').val(); 
$.get('file.xml',{}, function(xml) { 
    $('nodes',xml).each(function() { 
    id = $(this).find("id").text(); 
    desc = $(this).find("desc").text(); 
    if (id.toLowerCase() == value.toLowerCase()) { 
     tinyMCE.activateEditor.setContent(desc); 
    } 
    }); 
}); 

注意，你讓你的XML的coun和description屬性，而這些是不存在的。您在變量中將它們定義爲id和desc。

其次，你永遠不會觸發$.get()方法。所以我通過把這個放到function loadText() { ... }中，我在國家選擇框更改時觸發。

請參閱此處的功能示例：http://jsfiddle.net/S6Eqq/32/