jQuery根据子元素之一的值查找XML元素 [英] Jquery Find an XML element based on the value of one of it's children

问题描述

我正在使用一个简单的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>[phone] 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>元素，这样我就可以遍历并显示该人的所有信息.任何帮助将不胜感激.

解决方案

好吧，我不确定您如何选择<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响应之前完成执行，因此，任何尝试访问myXML变量中的<person>的尝试都将导致undefined的值.

相反，您需要在success回调内 中执行所需的任何操作，或者将其放置在另一个函数中，然后从success回调内调用该函数. /p>

我给出的示例在内部完成了工作.

不过，我仍然不确定您要选择哪个人.如果您想对每一个进行操作，则可以循环执行.例如，您可以使用:

$(xml).find("person").each(function() {
    // do your processing...
});

I'm working on a simple XML phonebook app to learn JQuery, and I can't figure out how to do something like this: When the user enters the first name of a contact in a textbox I want to find the entire record of that person. The XML looks like this:

<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>[phone] 2223230</number>
    <first_name>Max</first_name>
    <last_name>Muscle</last_name>
    <address>Mining Belt</address>
    <image>path/to/image</image>
</person>
</phonebook>

and the best I've been able to do with the jQuery is something like this:

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

What I want it to do is return the entire <person> element so I can iterate through and display all that person's information. Any help would be appreciated.

解决方案

Well, I'm not sure how you want to choose the <person> or how you want to display the result, but this example will find Evelyn, and place the related info into a variable;

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();

---

EDIT:

When you say that you want to "return" the <person>, be aware that you can't simply return it as you would in a regular function. The rest of your code has likely finished executing before the AJAX response was received, so any attempt to access the <person> in the myXML variable will result in a value of undefined.

Instead, you need to perform whatever manipulation you want inside the success callback, or you need to place it inside another function, and call that function from within the success callback.

The example I gave does the work inside.

I'm still not sure how it is that you want to select which person, though. If you wanted to operate on each one, then you would do so in a loop. For example, you could use:

$(xml).find("person").each(function() {
    // do your processing...
});

这篇关于jQuery根据子元素之一的值查找XML元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！