查看 805
回复 0
Discuz Ajax 无刷新加载范例
逆风天

16

主题

0

回帖

105

积分
发表于 2023-6-30 18:09:55
显示全部楼层 阅读模式
本帖最后由 逆风天 于 2023-6-30 18:33 编辑
实现目标:点击一个链接,不跳转,在制定容器中加载!

首先看官方文档中的说明
  1. ajaxget(url, showid, waitid, loading, display, recall)
  2. url
  3.         请求的 url
  4. showid
  5.         ajax 返回信息显示区域的 id
  6. waitid
  7.         ajax 请求过程中显示等待信息区域的 id
  8. loading
  9.         ajax 请求过程中显示的等待信息
  10. display
  11.         'none'        不显示
  12.         ''        显示
  13.         'auto'        自动
  14. recall
  15.         回执函数 ajax 请求完成并返回信息后执行 可以是一个函数(推荐)也可以是一段 js 代码
复制代码

1、添加链接
  1. <a href="{$_G['basescript']}.php?show=all" onclick="ajaxget(this.href, 'AjaxEchoBox', 'LoadingBox');doane(event);" class="list-item link-view">点我加载</a>
复制代码

2、加载效果和容器
  1. {if !$_G['inajax']}
  2. <div class="loading-box" id="LoadingBox" style="display:none">
  3.           <div class="spinner-border"></div>
  4.           <span>加载中...</span>
  5. </div>
  6. <div class="card-list view-list" id="AjaxEchoBox">
  7. {/if}

  8.           {if $_G['inajax']}
  9.           这里可以放置一些数据输出什么的,比如loop循环之类的,或者一些判断,链接的href可以传值,这里可以接收。
  10.           {/if}

  11. {if !$_G['inajax']}
  12. </div>
  13. {/if}
复制代码
需要注意的是 !$_G['inajax'] 这个是必须要存在的,用于区别ajax内容,如果不添加,ajax执行的时候会把外部的容器全部加载到 #AjaxEchoBox





您需要登录后才可以回帖 登录 立即注册
QQ 快速回复 返回列表