构建动态创建的Clickable Divs JQuery Ajax

时间:2011-03-27 18:19:16

标签: jquery ajax html clickable

我需要一些jQuery ajax帮助。 我目前有一个主内容div,它由对XML文件的ajax调用填充。 XML文件是从db结果集生成的。这一切都很好。单击按钮会触发ajax调用,但我希望更改它。

我有另一个div,我已经填充了一个标题列表。我希望发生的是当点击标题时,主要内容div应该使用与该标题相关的数据进行更新。我想知道最好的方法是什么。我应该创建一个可点击的div来进行ajax调用吗?如果是这样,我如何区分主内容div的代码中单击了哪个div。我希望这是有道理的...... 这是我填充列表的代码

$(document).ready(function() {
    $("#getData").click(function() {
        var $title = "";
        $.get("phpAjaxMovieListingTotal.php", function(theXML) {
            $('row',theXML).each(function(i) {
                $title = $(this).find("Title").text();
            });
            $("#movieListingContentDiv").html($title);
        });
    });
});

1 个答案:

答案 0 :(得分:1)

好的,对于从xml加载的可点击div列表,请查看演示。 The Demo

以下是代码:

function movieTitle_Clicked (title)
{
    alert("Movie title '"+title+"' clicked");
}
function GetMovies ()
{
    $.post("THEXML.php", function(data){

        $('row title',data).each(function(i){
            var title = $(this).text();
            $('#container').append('<div onClick="javascript:movieTitle_Clicked(\''+title+'\')">'+title+'</div>');
        });
    }, 'xml');
}
$(document).ready(function() {
      GetMovies();
});