这次给大家带来laravel框架中pjax使用案例详解，laravel框架中pjax使用的注意事项有哪些，下面就是实战案例，一起来看一下。
关于什么是pjax，请读者自行百度。
注意事项：
1、下载jquery.pjax.js文件点击下载
2、下载NProgress
3、将所需文件放入项目中，并在布局文件中引用。（框架public目录下）
开始：
这里笔者使用的是adminLTE后台模板，具体使用可参考在Laravel5.* 中使用 AdminLTE
安装pjax的注意事项（laravel中间件）：
$ composer require spatie/laravel-pjax
登录后复制
在kernel.php文件中加入代码:
// app/Http/Kernel.php...protected $middleware = [...SpatiePjaxMiddlewareFilterIfPjax::class,];
登录后复制
配置pjax完成页面交互：（ps：笔者整站使用pjax加载页面，故在全局js文件中配置pjax，读者可根据需要另行配置）
$.pjax.defaults.timeout = 5000;$.pjax.defaults.maxCacheLength = 0;//配置可点击的标签使用pjax$(document).pjax('a:not(a[target="_blank"])', { container: '#pjax-container'//配置pjax刷新容器});NProgress.configure({parent: '#pjax-container'});//超时执行函数$(document).on('pjax:timeout', function (event) { event.preventDefault();});
登录后复制
至此，laravel结合pjax已完成。
附件：
笔者的布局（layout.blade.php）：
AdminLTE <link rel="stylesheet" href="D:pic/2025-03-08/https://cdn.chuangxiangniao.com/2025/03/20250309113011447.css@include('admin::partials.header') @include('admin::partials.sidebar')
@yield('content') @include('admin::partials.control') @include('admin::partials.footer') var csrf_token = '{{ csrf_token() }}'; var selectedMenu = "{!! $requestUri !!}";
登录后复制
全局js文件（admin-base.js）：
toastr.options = { closeButton: true, progressBar: true, showMethod: 'slideDown', positionClass: 'toast-top-right', timeOut: 4000};$.pjax.defaults.timeout = 5000;$.pjax.defaults.maxCacheLength = 0;$(document).pjax('a:not(a[target="_blank"])', { container: '#pjax-container'});NProgress.configure({parent: '#pjax-container'});$(document).on('pjax:timeout', function (event) { event.preventDefault();});$(document).on('submit', 'form[pjax-container]', function (event) { $.pjax.submit(event, '#pjax-container')});$(document).on("pjax:popstate", function () { $(document).one("pjax:end", function (event) { $(event.target).find("script[data-exec-on-popstate]").each(function () { $.globalEval(this.text || this.textContent || this.innerHTML || ''); }); });});$(document).on('pjax:send', function (xhr) { if (xhr.relatedTarget && xhr.relatedTarget.tagName && xhr.relatedTarget.tagName.toLowerCase() === 'form') { $submit_btn = $('form[pjax-container] :submit'); if ($submit_btn) { $submit_btn.button('loading') } } NProgress.start();});$(document).on('pjax:complete', function (xhr) { if (xhr.relatedTarget && xhr.relatedTarget.tagName && xhr.relatedTarget.tagName.toLowerCase() === 'form') { $submit_btn = $('form[pjax-container] :submit'); if ($submit_btn) { $submit_btn.button('reset') } } NProgress.done();});$(function () { $('.sidebar-menu li:not(.treeview) > a').on('click', function () { var $parent = $(this).parent().addClass('active'); $parent.siblings('.treeview.active').find('> a').trigger('click'); $parent.siblings().removeClass('active').find('li').removeClass('active'); }); $('[data-toggle="popover"]').popover(); //整页刷新时，菜单显示 var selector = $('.sidebar-menu').find('a[href="/'+ selectedMenu +'"]'); selector.parent().addClass('active'); selector.parents('ul.treeview-menu').css('display', 'block'); selector.parents('li.treeview').addClass('menu-open'); //datatables删除按钮 $('#pjax-container').on('click', '.row-delete', function () { var del_url = $(this).data('url'); swal({ title: "确定删除此项？", type: "warning", showCancelButton: true, confirmButtonColor: "#DD6B55", confirmButtonText: "确 定", closeOnConfirm: false, cancelButtonText: "取 消" }, function(){ $.ajax({ method: 'post', url: del_url, data: { _method:'delete', _token:csrf_token, }, success: function (data) { if (typeof data === 'object') { if (data.status) { swal(data.message, '', 'success'); $.pjax.reload('#pjax-container'); } else { swal(data.message, '', 'error'); } } } }); }); });});
登录后复制
相信看了本文案例你已经掌握了方法，更多精彩请关注【创想鸟】其它相关文章！
推荐阅读：
注意事项
注意事项
以上就是laravel框架中pjax使用案例详解的详细内容，更多请关注【创想鸟】其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至253000106@qq.com举报，一经查实，本站将立刻删除。
发布者：PHP中文网，转转请注明出处：https://www.chuangxiangniao.com/p/2758221.html
