JQuery的/ AJAX：加载外部的div使用动态内容 [英] JQuery/AJAX: Loading external DIVs using dynamic content

问题描述

我需要创建一个页面，将加载的div使用jQuery和AJAX外部网页。

I need to create a page that will load divs from an external page using Jquery and AJAX.

我所遇到的一些很好的教程，但它们都是基于静态的内容，我的链接和内容是由PHP生成。

I have come across a few good tutorials, but they are all based on static content, my links and content are generated by PHP.

主要的教程中，我立足我的code的距离：
的http://yensdesign.com/2008/12/how-to-load-content-via-ajax-in-jquery/

The main tutorial I am basing my code on is from:
http://yensdesign.com/2008/12/how-to-load-content-via-ajax-in-jquery/

确切的功能，我需要如下：

The exact function i need is as follows:

1. 主页包含永久格列包含一个参数一定的联系。
2. 一旦点击，链接参数传递给外部的页面。
3. 在外部网页过滤记录对参数和填充的div的结果。
4. 新的div包含了一组新的与新参数的链接。
5. 在外部DIV加载主页面第一个div下面。
6. 过程可以被重复下彼此建立一系列的div。
7. 在链中的最后一个分区会然后直接到了新的一页整理所有的previously使用查询字符串。

我可以处理所有的PHP工作与填充的div的主要外部页面。
这是jQuery和AJAX部分我挣扎与

I can handle all of the PHP work with populating the divs on the main and external pages.
It's the JQuery and AJAX part i'm struggling with.

$(document).ready(function(){
    var sections = $('a[id^=link_]'); // Link that passes parameter to external page
    var content = $('div[id^=content_]'); // Where external div is loaded to

    sections.click(function(){ 
    	//load selected section
    	switch(this.id){
    		case "div01":
    			content.load("external.php?param=1 #section_div01");
    			break;
    		case "div02":
    			content.load("external.php?param=2 #section_div02");
    			break;			
    	}
});

我遇到的问题越来越jQuery来动态生成的参数传递给外部的页面，然后检索新的div。
我只能用目前的静态链接做到这一点（如上）。

The problem I am having is getting JQuery to pass the dynamically generated parameters to the external page and then retrieve the new div.
I can currently only do this with static links (As above).

推荐答案

我不知道你是否已经解决了这一点，但我很惊讶没有人提到使用AJAX（）函数。

I'm not sure if you've solved this already, but I'm surprised no one's mentioned to use the ajax() function.

这将允许您定义请求类型GET：

This would allow you to define the request type as GET:

function loadContent(id) {

    $.ajax({
    	type: "GET",
    	url: "external.php",
    	dataType: 'html',
    	data: {param: id},

    	success: function(html){
                 $("#container").html(html);
    	},

    	error: function(){
    	},

    	complete: function(){
    	}
    });

}

就在调用此函数，而不是使用负载。显然，你必须用code修补（主要是什么内容可以被成功函数）一点点，但是这应该给你一个很好的起点。

Just call this function instead of using load. Obviously you'll have to tinker with the code (mainly what goes in the success function) a little, but this should give you a good starting point.

这篇关于JQuery的/ AJAX：加载外部的div使用动态内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！