更新网页的某些部分？答案

【问题标题】：update some part of the webpage?更新网页的某些部分？
【发布时间】：2013-06-12 16:00:57
【问题描述】：

为了快速参考，我附上了我想要的图片。我想更新（更改内容）而不更新整个页面（不刷新页面）。单击白框上的链接或按钮应从数据库中获取数据，并将其显示在红框中。当然，作为答案，您首先要写的是“Ajax !!!”，但由于我是 laravel framework 的新手，我想知道实现这一目标的最佳方法是什么，我应该写 javascript直接在视图中或在控制器中，如何通过控制器做到这一点？如果您需要更多信息，请告诉我。

修改后的问题，除了回答的问题，还有其他更好的方法吗

【问题讨论】：

可以使用 PrimeFaces Ajax POLL

标签： ajax laravel laravel-4

【解决方案1】：

首先我们需要设置一些路由。您也可以使用控制器来执行此操作。

Route::get('home', function()
{
    return View::make('home');
});

Route::get('someRoute', function()
{
    return View::make('someView');
});

对于主页视图，我会添加一个脚本部分：

//home.php

<html>
<head>
    <script>
    $('a.ajax').click(function(e){
        e.preventDefault();
        var pageURL = $(this).attr('href');
        $('#ajaxContent').load(pageURL);
    });
    </script>
</head>
<body>
    <div class="wrapper">
        <a href="{{URL::to('someRoute')}}" class="ajax">Click Here</a>
        <div id="ajaxContent"></div>
    </div>
</body>
</html>

如果您使用刀片模板，这里有一个实现

//main.blade.php

<html>
<head>
    @yield('styles')
</head>
<body>
    <div class="wrapper">
        @yield('content')
    </div>
    @section('scripts')
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
    @show
</body>
</html>

//home.blade.php
@extends('main')

@section('content')
    <a href="<?=URL::to('someRoute')?>" class="ajax">Click Here</a>
        <div id="ajaxContent"></div>
@stop

@section('scripts')
    @parent
    $('a.ajax').click(function(e){
    e.preventDefault();
    var pageURL = $(this).attr('href');
    $('#ajaxContent').load(pageURL);
    });
@stop

【讨论】：

感谢您的回复，但我知道这一点，我想知道有没有其他更好的方法。
我认为这取决于使用情况。如果您的模板是模块，这意味着您将包含多个视图的 sn-ps，那么您将需要覆盖部分，甚至创建一个包含所有 javascript 并包含它的视图。如果您不关心模块化，那么第一个选项可能会更好。无论哪种方式，您的 javascript 都应该在视图中，而不是控制器中。另一种选择是使用 iframe，但我不推荐它

【解决方案2】：

如果您使用 jQuery 使用 ajax 功能进行此更新，对您会更好。一个简单的代码可以是这样的

$('a.ajax').click(function(e){
     e.preventDefault();
     var pageURL = $(this).attr('href');
     $('#divID-to-be-updated').load(pageURL);
});

更多关于 jQuery 中的 ajax 功能可以阅读http://jqapi.com/#p=load

【讨论】：