关于jQuery的问题并重新载入页面

以Twitter为例。顶部有一个输入文字表单，用于撰写推文并位于推文列表下方。如果您撰写新推文并点击“Tweet”按钮，您将立即在推特列表中看到您的新推文，无需重新加载页面。我知道这是一个平庸的情况，但顺便我想问你。

我有一个页面，顶部有一个窗体，下面有一个消息列表。填写表单并提交新消息时，会重新加载该页面，并且您会看到带有新消息的更新消息列表。我想实现Twitter使用的相同技术。也许我应该使用jQuery，并将数据发送到$.post的页面。你能解释一下吗？

来源

2011-05-01 Fred Collins

你可以发布你的标记？或者在[JS Fiddle]（http://jsfiddle.net/）上发布一些东西来展示你的使用？ – 2011-05-01 20:47:41

是的，使用jQuery和'$ .post（）'。如果你无法正常工作，请使用你试过的代码回到这里，我相信有人会帮你调试它。 http://api.jquery.com/jQuery.post/供参考。 – ggutenberg 2011-05-01 20:49:27

@David我没有标记，我有一个简单的表单，在数据库中插入一条消息，并在其下方显示消息列表。很简单。但每次提交后页面都会重新加载。我不想重新加载，但我希望消息列表在提交后立即刷新。 – 2011-05-01 21:02:09

当你是一个初学者，我觉得最简单的方式将是我会描述的一个。如果你有这个div（您希望新的饲料出现）：

标记：

<div id="feeds"> 
    <div class="feed"> Feed 1</div> 
    <div class="feed"> Feed 2</div> 
    <!-- Your new feed will appear here --> 
</div>

的Javascript：

$("div.feed:last").clone().appendTo("#feeds").load("newfeed.php?param1=val1");

服务器（asuming PHP）：

<? //newfeed.php 
    $param1 = $_GET['param1']; 
    $content = "Here put your latest feed"; 
    echo $content; 
?>

就是这样。

现在，我要解释一下我们的JavaScript线

$("div.feed:last")  //Select the last div with class "feed" 
    .clone()    //We clone it, to make space for the new feed 
    .appendTo("#feeds") //We add the clone to the final of the feed list 
    .load("newfeed.php?param1=val1"); //Load it's content with a value got from server

当你觉得使用jQuery更舒适，使用$就不是在做什么。希望这可以帮助，欢呼

来源

2011-05-01 21:21:58

非常感谢你。一个实际的例子总是非常有用。 – 2011-05-02 02:46:19

弗雷德，

你可以使用jQuery阿贾克斯一样，

在阿贾克斯成功更新您的DOM HTML

http://api.jquery.com/jQuery.ajax/

来源

2011-05-01 20:49:36 kobe

关于jQuery的问题并重新载入页面

回答

相关问题