ajax – 更新网页的某些部分？

发布时间：2020-12-16 02:48:40 所属栏目：百科来源：网络整理

导读：为了快速参考,我附上了我想要的图像. 我想更新(更改内容)而不更新整个页面(不刷新页面).单击白盒上的链接或按钮应该从数据库中获取数据并将其显示在红色框中.当然,你要写的第一件事就是“Ajax !!!”,但是由于我是laravel框架的新手,我想知道实现这一目标的最

为了快速参考,我附上了我想要的图像.
我想更新(更改内容)而不更新整个页面(不刷新页面).单击白盒上的链接或按钮应该从数据库中获取数据并将其显示在红色框中.当然,你要写的第一件事就是“Ajax !!!”,但是由于我是laravel框架的新手,我想知道实现这一目标的最佳方法是什么,我应该直接在 javascript中编写javascript查看或在控制器中,以及如何通过控制器执行此操作？如果您需要更多信息,请告诉我.

修改过的问题,除了答案之外还有其他更好的方法

解决方法

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

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

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!