为特定元素发出ajax请求的最有效方法

I have been playing with jQuery .load function to grab a particular div from a page.

我一直在玩jQuery .load函数来从页面中获取特定的div。

$('#result').load('ajax/test.html #variable123');

This works like it should, however it is taking forever because the Response still contains the complete document even though all that is returned in #result is the div that I defined.. in this example #variable123

这应该是应该的,但它会永远占用,因为响应仍然包含完整的文档,即使在#result中返回的所有内容都是我定义的div ..在此示例中#variable123

Is there another way I could accomplish this but only have the response contain that actual div? What would be the fastest way to return this result?

有没有其他方法可以实现这一点,但只有响应包含实际的div?返回此结果的最快方法是什么?

To further clarify, the id that I am searching for is generated from a foreach loop on each page.

为了进一步说明,我正在搜索的id是从每个页面上的foreach循环生成的。

<img name="<?php echo $_product->getId() ?>"

and then an onclick event for them to make the ajax request for that related div id.

然后是一个onclick事件,让他们为相关的div id发出ajax请求。

   $('img').click(function () {  
      $('#result').load('ajax/test.html .' + $(this).attr("name"));
   });

The page test.html also has a foreach loop that generates div blocks with the same id as was passed in the name. David and Juan both suggested sever side solutions. Can someone please explain this a bit more to me?

页面test.html还有一个foreach循环,它生成与名称中传递的id相同的div块。大卫和胡安都提出了严重的解决方案。有人可以向我解释一下这个吗?

3 个解决方案

#1

Since you can't fetch arbitrary parts of a file:

由于您无法获取文件的任意部分:

$('#result').load('ajax/test_with_only_variable123_in_it.html');

You can, of course, use a server side program instead of generating a bundle of static files.

当然,您可以使用服务器端程序而不是生成一组静态文件。

#2

As others suggested, you need to implement the functionality server side, not client side. It is not possible to use javascript to load part of a html file, so you'll either need to have an individual html file for every result you'll require (as David suggested), or create a server side script to manage this for you. For example:

正如其他人所建议的那样,您需要实现功能服务器端,而不是客户端。无法使用javascript加载部分html文件,因此您需要为您需要的每个结果(如David建议的那样)拥有单独的html文件,或创建服务器端脚本来管理此文件。您。例如:

Your html/js file would look like this:

你的html / js文件看起来像这样:

 $('img').click(function () {  
   $('#result').load('ajax/test.php?id=' + $(this).attr('name'));
 });

I would probably use .get() or .ajax() over .load() to pass the data, but for this example, .load() should work as above.

我可能会在.load()上使用.get()或.ajax()来传递数据,但是对于这个例子,.load()应该如上所述。

In your test.php file, get the ID, and load the required content (something like this):

在test.php文件中,获取ID,并加载所需的内容(如下所示):

<?php 
// load class/model/whatever you need to do

$id = $_GET['id'];
$product = $productmodel->get($id); // or however you load a single product from your class/model

// echo data from $product
?>

If the second part doesn't make sense, please let us know how your products are stored ( whether you're using a simple OO approach, or using a php framework such as codeigniter) and we'll try to give a more detailed example of the server side code.

如果第二部分没有意义,请告诉我们您的产品是如何存储的(无论您使用的是简单的OO方法,还是使用像codeigniter这样的php框架),我们将尝试提供更详细的示例服务器端代码。

#3

you could try to call to a function like this:

你可以尝试调用这样的函数:

$('#target').load("functions.php",{action:"that_div"});

if($_POST){  
    $action = $_POST['action'];  
    if($action == "that_div"){  
        exit( "<div>Your div</div>" );  
    }    
    if($action == "another_div"){  
        exit("<div>Your another div</div>");  
    }  
}

as David sugested

大卫闷闷不乐

#1