Jquery根据其中一个子元素的值查找XML元素

时间:2010-06-17 17:20:40

标签: javascript jquery

我正在研究一个简单的XML电话本应用程序来学习JQuery,我无法弄清楚如何做这样的事情: 当用户在文本框中输入联系人的第一个名字时,我想查找该人的整个记录​​。 XML看起来像这样:

<phonebook>
<person>
    <number> 555-5555</number>
    <first_name>Evelyn</first_name>
    <last_name>Remington</last_name>
    <address>Edge of the Abyss</address>
    <image>path/to/image</image>
</person>
<person>
    <number>+34 1 6444 333 2223230</number>
    <first_name>Max</first_name>
    <last_name>Muscle</last_name>
    <address>Mining Belt</address>
    <image>path/to/image</image>
</person>
</phonebook>

我能用jQuery做的最好的事情是这样的:

var myXML;
function searchXML(){
  $.ajax({
     type:"GET",
     url: "phonebook.xml",
     dataType: "xml",
     success: function(xml){myXML = $("xml").find("#firstNameBox").val())}
  });
 }

我想要它做的是返回整个<person>元素,以便我可以迭代并显示该人的所有信息。任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:6)

好吧,我不确定您要如何选择<person>或如何显示结果,但此示例将找到Evelyn,并将相关信息放入变量中;

var myXML; 

function searchXML(){
  $.ajax({
     type:"GET",
     url: "phonebook.xml",
     dataType: "xml",
     success: function(xml){
              // Filter Evelyn out of the bunch
            myXML = $(xml).find("person").filter(function() {
                return $(this).find('first_name').text() == "Evelyn";
            });

              // Store a string with Evelyn's info in the display variable
            var display = myXML.children().map(function() {
                return this.tagName + '=' + $(this).text();
            }).get().join(' ');

              // alert the result
            alert(display);
        }
  });
}
searchXML();

修改

当您说要“返回”<person>时,请注意您不能像在常规函数中那样简单地返回它。在收到AJAX响应之前,其余代码可能已完成执行,因此任何尝试访问<person>变量中myXML的任何尝试都将导致undefined的值。

相反,您需要执行 in success回调中的任何操作,或者您需要将其放在另一个函数中,并在{{1}内调用该函数回调。

我给出的例子是内部的工作。

我仍然不确定你想要选择哪个人是怎么回事。如果你想对每一个进行操作,那么你会在一个循环中这样做。例如,您可以使用:

success