使用getScript()方法异步加载并执行js文件

使用getScript()方法异步请求并执行服务器中的JavaScript格式的文件，它的调用格式如下所示：

jQuery.getScript(url,[callback])或$.getScript(url,[callback])

参数url为服务器请求地址，可选项callback参数为请求成功后执行的回调函数。

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

     <head>

         <title>使用getScript()方法异步加载并执行js文件</title>

         <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>

         <style>

             #divtest

             {

                 width: 282px;

             }

             #divtest .title

             {

                 padding: 8px;

                 background-color:blue;

                 color:#fff;

                 height: 23px;

                 line-height: 23px;

                 font-size: 15px;

                 font-weight: bold;

             }

             ul

             {

                 float: left;

                 width: 280px;

                 padding: 5px 0px;

                 margin: 0px;

                 font-size: 14px;

                 list-style-type: none;

             }

             ul li

             {

                 float: left;

                 width: 280px;

                 height: 23px;

                 line-height: 23px;

                 padding: 3px 8px;

             }

             .fl

             {

                 float: left;

             }

             .fr

             {

                 float: right;

             }

         </style>

     </head>

     <body>

         <div id="divtest">

             <div class="title">

                 <span class="fl">我最喜欢的运动</span>

                 <span class="fr">

                     <input id="btnShow" type="button" value="加载" />

                 </span>

             </div>

             <ul></ul>

         </div>

         <script type="text/javascript">

             $(function () {

                 $("#btnShow").bind("click", function () {

                     var $this = $(this);

                     $.getScript("./sport.js",function(){

                         $this.attr("disabled", "true");

                     });

                 })

             });

         </script>

     </body>

 </html>
 var data = [{

         "name":"足球"

     },{

         "name":"篮球"

     },{

         "name":"乒乓球"

     },{

         "name":"排球"

 }];

 $.each(data,function(index,sport){

     $("ul").append("<li>"+sport['name']+"</li>");

 });

使用getScript()方法异步加载并执行js文件的更多相关文章

  1. 使用getJSON()方法异步加载JSON格式数据

    使用getJSON()方法异步加载JSON格式数据 使用getJSON()方法可以通过Ajax异步请求的方式,获取服务器中的数组,并对获取的数据进行解析,显示在页面中,它的调用格式为: jQuery. ...

  2. JQuery 加载 CSS、JS 文件

    JS 方式加载 CSS.JS 文件: //加载 css 文件 function includeCss(filename) { var head = document.getElementsByTagN ...

  3. JQuery文档加载完成执行js的几种方法

    js中文档加载完毕.一般在body加一个onload事件或者window.onload = function () {} jQuery中有好多写法,平时也不注意,别人一问,还真觉得头大. 下面是我整理 ...

  4. 动态加载CSS，JS文件

    var Head = document.getElementsByTagName('head')[0],style = document.createElement('style'); //文件全部加 ...

  5. 脚本加载后执行JS回调函数的方法

    动态脚本简单示例 // IE下: var HEAD = document.getElementsByTagName('head')[0] || document.documentElement var ...

  6. 用JavaScript动态加载CSS和JS文件

    本文转载自:http://www.cnblogs.com/xiaochaohuashengmi/archive/2011/11/14/2248451.html 今天项目中需要用到动态加载 CSS 文件 ...

  7. 火狐浏览器怎么查看页面加载了那些js文件，那系js文件有作用

    方法一: 右击查看原代码,点击js链接如果能够看到文件内容,证明加载成功 方法二: 按F12键,如果控制台没有加载错误,证明加载成功:

  8. .NET Web后台动态加载Css、JS 文件，换肤方案

    后台动态加载文件代码: //假设css文件:TestCss.css #region 动态加载css文件 public void AddCss() { HtmlGenericControl _CssFi ...

  9. JavaScript动态加载CSS和JS文件

    var dynamicLoading = { css: function(path){ if(!path || path.length === 0){ throw new Error('argumen ...

随机推荐

  1. 网站如何提高PR值

    做了站长这些年,积累些经验,记录下来,分享兄弟. 一.商城类型网站 对于商城型的网站站内优化来说,主要是用户咨询和浏览产品时产生的疑问.比如当某用户看到一些自己感兴趣的产品需要咨询的时候,自然就会寻找 ...

  2. 开始ubuntu 14.04 的装X模式---终端模式下中文输入，听歌，上irc 开启framebuffer看电影 截图

    先上图吧 卡卡的全是在tty1 下的操作,看电影,听歌,截图 ,看图  ,上irc 等等,相当适合在小白面前装屁! 需要安装的软件: 为了能正常显示中文:安装fbterm sudo apt-get i ...

  3. 9种jQuery和css3图片动画特效代码演示

    1.自由旋转的jQuery图片 演示和下载地址 2.css3阴影动画效果 演示和下载地址 3.拉窗帘特效图片 演示和下载地址 4.css3文字特效动画 演示和下载地址 5.css3时钟代码 演示和下载 ...

  4. Python数据结构——链表的实现

    链表由一系列不必在内存中相连的结构构成,这些对象按线性顺序排序.每个结构含有表元素和指向后继元素的指针.最后一个单元的指针指向NULL.为了方便链表的删除与插入操作,可以为链表添加一个表头. 删除操作 ...

  5. MATLAB plot画线的颜色设定

    plot中画线的颜色通常是八种: 标记符    颜色r          红g          绿b          蓝c          蓝绿m          紫红y          黄 ...

  6. MySQL显示连接的数据库名

    在默认下,MySQL在use databasename的时候,是不显示连接的库名! mysql> show databases;+--------------------+| Database ...

  7. Serverless 架构：用服务代替服务器

    Serverless 架构:用服务代替服务器 转载本文需注明出处:EAII企业架构创新研究院(微信号:eaworld),违者必究.如需 加入微信群参与微课堂.架构设计与讨论直播请直接回复此公众号:&q ...

  8. cocos3.2版本中的一些新特性

    1.设置屏幕分辨率的大小,需要手动添加: 2.去掉了所有CC开头的命名: 3.所有的单例(以前是采用shared开头方法),全部改为getInstance(); 4.cocos3.x以上的版本支持C+ ...

  9. 仿微博视频边下边播之滑动TableView自动播放-b

    Tips:这次的内容分为两篇文章讲述01.[iOS]仿微博视频边下边播之封装播放器 讲述如何封装一个实现了边下边播并且缓存的视频播放器.02.[iOS]仿微博视频边下边播之滑动TableView自动播 ...

  10. 例题-文件系统的放大 (LVM)：

    纯粹假设的,我们的 /home 不够用了,你想要将 /home 放大到 7GB 可不可行啊? 答: 因为当初就担心这个问题,所以 /home 已经是 LVM 的方式来管理了.此时我们要来瞧瞧 VG 够 ...