使用jquery局部刷新(jquery.load)从数据库取出数据

因为Jquery 是一个很好的javascript框架，我对他的运用还只是表面的，处于一个初步学习的阶段，所以通过博客记录我学习的点滴，大神可以略过，写此文章希望可以帮到和我一样的初学者，共同分享，共同进步。

现在ajax越来越受到web开发者的青睐，jquery提供了很好的ajax交互，我这里用的是直接返回字符串，用的是jquery.load方法，是很基础的。 项目下载

需要注意两点：

1、jquery.js的路径要正确，不然很难达到你想要的效果。

2、需要使用$(document).ready，这个方法的意思是，等文档加载完后再执行里面的JS脚本，如果你不加的话，就有可能在你文档机构还没加载完，就已经执行了事件绑定 这块语句，但是此时你的“#load”还没加载好，导致事件绑定失败。

赞 (0)

相关推荐

  • 用Jquery.load载入页面实现局部刷新

    因为开始不懂Jquery,一直想用jquery.load的方法载入新的页面,以实现局部刷新,结果发现载入进来的页面与原来单独的页面不一样,样式没了,后来在网上查了一下,发现了解决办法,这是别人的回答: 是这样的,如果不过滤掉一些内容的话,直接加载,会使页面混乱的,比如新的页面也存在<body>标签,加载进来后,一个页面就会存在两个<body>标签是不规范的的HTML.这个是在jquery.load()函数中规定的.一般加载进来的页面需要自己根据加载的内容的元素重新定义CSS样式和添

  • 使用jQuery.fn自定义jQuery翻页插件

    使用jQuery.fn自定义jQuery翻页插件

    第一次写jQuery插件.自己感觉写的也不怎么样.写jQuery插件利用的就是这个东东 jQuery.fn,例如 复制代码 代码如下: jQuery.fn.pluginName=function(){}; 这个是我写的分页插件的样子 插件通过一个外放的函数来进行翻页操作,无论是点击前进.后退.还是改变页面大小,都会调用该函数. 先看看插件的代码结构 复制代码 代码如下: (function ($) { //存放插件所需的属性字段 var PagerFields = { }; //插件的私有函数

  • JQuery的Ajax请求实现局部刷新的简单实例

    JQuery的Ajax请求实现局部刷新的简单实例

    请求的ajax路径传递的参数(data)会到action中被一个同样名字的变量(附带set get方法)接收,返回的data是一个JQuery的数组对象,在被调用的action中涉及到的数据变量会对象,都会封装到data中最终返回给页面. 案例:如图 我要实现状态的更改,用JQuery的Ajax更改完之后图标发生改变,实现页面的局部刷新 原理:局部刷新是刷新页面的一部分,在此案例中实现的只是图标的改变,把后台代码和前台现实的图标分离,并不是对数据库重新做查询,二是后台数显数据修改之后,前台直接改

  • jQuery 翻页组件yunm.pager.js实现div局部刷新的思路

    jQuery 翻页组件yunm.pager.js实现div局部刷新的思路

    前端的翻页插件有很多,bootstrap的翻页界面看起来就不错,做起来也易于上手,但应用于项目中的翻页实现还有有几个难点,分别是: 如何封装一个翻页插件,如题中的yunm.pager.js. 涉及到的div局部刷新该如何做. 在没给大家介绍正文之前,先给大家展示下效果图,如果感觉还不错,请继续往下阅读: 翻页的总体流程涉及到的知识点很多,这篇文章我们也主要来关注以上两点,其余的内容,请自悟. 一.如何定义局部刷新的div 翻页时,我们一般只会刷新页面中涉及到翻页的父级div,那么该如何定义呢?

  • jQuery 定时局部刷新(setInterval)

    复制代码 代码如下: <head> <script src="jQuery/jquery-1.4.1.min.js" type="text/javascript"></script> <script> $(document).ready(function () { setInterval("startRequest()",1000); }); function startRequest() { $(

  • jQuery ajaxSubmit 实现ajax提交表单局部刷新

    AJAX简介 AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML). AJAX 不是新的编程语言,而是一种使用现有标准的新方法. AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下. 需要引入 : jquery-form.js 使用说明: Java代码 $(document).ready(function() { var options = { target: '#mydiv', // 需要刷新的区域

  • JQuery插件iScroll实现下拉刷新，滚动翻页特效

    JQuery插件:iScroll 页面布局: <div id="wrapper"> <div id="scroller"> <div id="pullDown"> <span class="pullDownIcon"></span><span class="pullDownLabel">下拉刷新...</span> <

  • 通过pjax实现无刷新翻页(兼容新版jquery)

    pushState是一个可以操作history的api,该api的介绍和使用请见这里:http://www.welefen.com/use-ajax-and-pushstate.html 目前已经有http://github.com/, http://plus.google.com, http://www.welefen.com 等网站已经使用. pjax是对ajax + pushState的封装,让你可以很方便的使用pushState技术. 同时支持了缓存和本地存储,下次访问的时候直接读取本地

  • 基于jQuery捕获超链接事件进行局部刷新代码

    基于jQuery捕获超链接事件进行局部刷新代码

    核心代码: 复制代码 代码如下: <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title>A Click Event Test</title> <script type="text/javascript" src="jquery.min.js"

  • 封装的jquery翻页滚动(示例代码)

    HTML结构: 复制代码 代码如下: ul._rollSe{width:100px;height:300px;over-flow:hidden}  ul._rollSe li._rollPar{height:100px;border:1px solid #369} 复制代码 代码如下: <div class="_rollParent">  <ul class="_rollPageSe">  <li class="_rollpa

  • 使用jQueryMobile实现滑动翻页效果的方法

    使用jQueryMobile实现滑动翻页效果的方法

    本文实例讲述了使用jQueryMobile实现滑动翻页效果的方法.分享给大家供大家参考.具体分析如下: 滑动手势在移动设备是很流行的,在移动设备中滑动翻页中很常见 虽然这个功能可以在jQueryMobile中实现,但是个人与之前一篇[jQuery手机浏览器中拖拽动作的艰难性分析]中的观点一致,由于这是在手机浏览器中浏览,而不是安卓的一个独立APP,所以不要经常除点击以外的移动设备手势,以免跟手机浏览器与手机系统本身的手势发生冲突. 那么,使用jQueryMobile实现滑动翻页的效果到底怎么做呢

随机推荐