Ajaxで引数を指定して関数を呼び出すと成功しますか？

Question

私はこのような構造を持つXMLファイルを持っている：

<?xml version="1.0" encoding="utf-8" ?> 
<Photobank> 
<Landowner Name="Arnoldo"> 
    <Photo> 
    <Animal>Jaguar</Animal> 
    <Category>Cat</Category> 
    <Image>Charlie_20111120_010500.JPG</Image> 
    </Photo> 
    <Photo> 
    <Animal>Tapir</Animal> 
    <Category>Prey</Category> 
    <Image>Charlie_20111120_010500.JPG</Image> 
    </Photo> 
</Landowner> 
<Landowner Name="Charlie"> 
    <Photo> 
    <Animal>Margay</Animal> 
    <Category>Cat</Category> 
    <Image>Charlie_20111120_010500.JPG</Image> 
    </Photo> 
    <Photo> 
    <Animal>Tayra</Animal> 
    <Category>Prey</Category> 
    <Image>Charlie_20111120_010500.JPG</Image> 
    </Photo> 
</Landowner> 
</Photobank> 

をそして、私は、最初のページの負荷に1人の地主ためのすべての写真を解析してフォーマットするために私のページのために好きで、その後のdivを空にして埋めるだろうボタンを押すと別の土地所有者の写真が表示されます。これまでXMLを解析して初期ロード時に適切な土地所有者の写真を得ることができましたが、私は他の土地所有者の写真を表示するためにこの関数を書くのに問題があります。ここで

はjQueryのAjaxのです：

$.ajax({ 
    type: "GET", 
    url: "xml/photobank.xml", 
    dataType: "xml", 
    success: xmlParser 
}); 


function xmlParser(xml) { 
    $('#photo_container').empty(); 
    console.log('1'); 
    $(xml).find('Landowner').each(function(){ 
     console.log('2'); 
     var landownerName = $(this).attr('Name'); 
     if (landownerName==="Charlie") { 
      $(this).find('Photo').each(function(){ 
       $("#photo_container").append('<div class="photo ' + $(this).find("Category").text().toLowerCase() + '"><p>' + $(this).find("Animal").text() + '</p>'+ '<img class="photobank" src="images/' + $(this).find("Image").text() + '" />' + '</div>'); 
      }) 
     } 
    }); 
} 

私は、関数の引数として使用しますが、私がしようとするたびに関数宣言に引数を追加することを変数とxmlParserで==="Charlie"を交換したいと思います最初のAjaxのロードが停止します。何かヒント？

以下の私の開発ページのコードは、 "Arnoldo"ボタンを使用してコンテンツを切り替えようとしていますが、あまりにも遠くには行きませんでした。私はこれを達成するために別の方法を使用することにもオープンしています（非Ajax、JSON？）。私は、他の人が将来写真情報を簡単に追加できるようにしたいだけです。

ライブ例： HTML：http://lamanai.org/catmap/index.html

JS：http://lamanai.org/catmap/js/cameramap.js

XML：http://lamanai.org/catmap/xml/photobank.xml

---

アップデート：以下ShankarSangoliが、私は機能に私がしたいの道を形成支援してきましたが、今では私の最初のAjax呼び出しは機能しません。私はUncaught Error: Invalid XML: [object Document]をコンソールに持っています。私は間違った時間にAjaxを呼び出すと思います（現在は文書が用意されています）。何か案は？上記のライブページを参照してください。

Answer 1

xmlを使用する前に、$.parseXMLを使用して解析する必要があります。匿名の成功ハンドラを持ち、xmlParserを呼び出してxmlデータと別のパラメータを渡すことができます。

$.ajax({ 
    type: "GET", 
    url: "xml/photobank.xml", 
    dataType: "xml", 
    success: function(xml){ 
     xmlParser(xml, "Arnoldo"); 
    } 
}); 

function xmlParser(xml, landOwner) { 

    xml = $.parseXML(xml); 

    $('#photo_container').empty(); 
    console.log('1'); 
    $(xml).find('Landowner').each(function(){ 
     console.log('2'); 
     var landownerName = $(this).attr('Name'); 
     if (landownerName === landOwner) { 
      $(this).find('Photo').each(function(){ 
       $("#photo_container").append('<div class="photo ' + $(this).find("Category").text().toLowerCase() + '"><p>' + $(this).find("Animal").text() + '</p>'+ '<img class="photobank" src="images/' + $(this).find("Image").text() + '" />' + '</div>'); 
      }) 
     } 
    }); 
} 

参考：http://api.jquery.com/jQuery.parseXML/