Append加载动态轮播

前几天遇到了些小麻烦,不过很快就解决了。之所以要记下来是因为作为一名前端的程序员,要理解页面的加载顺序是最重要的。要不然自己写程序意外的出现bug~~

刚开始写利用Append的时候,利用火狐的firebug查看元素class里面swiper-slide还在,可是轮播的时候没有动态的效果。数据库里有轮播的五条数据。。。。。

首先加载顺序一定要理解:

下面是我的js代码

 1 $(function(){
 2     showCarousel();//轮播动态数据
 3 });
 4 /***
 5 * ** Date: 2017/01/09
 6 * ** Author: Black_Jay郗
 7 * ** Function: 轮播动态   (需要注意加载顺序)
 8 ***/
 9 function showCarousel(){
10     //var str001 = ‘‘
11     $.ajax({
12         url: ‘’,
13         type: ‘Post‘,
14         dataType: ‘json‘,
15         success: function(data) {
16             for ( var i = 0 ; i < data.length ; i ++ ) {
17                 var url = data[i].Url;
18                 var image = data[i].Image;
19                 lunbo(url,image);
20             }
21             //$.parser.parse(str001);
22             var mySwiper = new Swiper(‘#slide‘,{
23                 pagination: ‘.pagination‘,
24                 slidesPerView: 1,
25                 paginationClickable: true,
26                 preloadImages: false,
27                 lazyLoading: true,
28                 autoplay: 5000,
29                 autoplayDisableOnInteraction: false,
30                 loop: true
31             });
32         }
33     });
34     function lunbo(url,image){
35         $("#showCarousel").append("<div class=‘swiper-slide‘>"
36                 +"<a href=‘"+url+"‘>"
37                 +"<img style = ‘width:100%;height:200px;‘ src=‘"+image+"‘ />"
38                 +"</a>"
39                 +"</div>");
40     }
41 }

想必这样的加载顺序就可以迎刃而解了。

关于页面的加载顺序的分析,以后工作中遇到问题。在与大家一起讨论。。!~

时间: 2024-10-06 12:19:16

Append加载动态轮播的相关文章

NGINX 加载动态模块(NGINX 1.9.11开始增加加载动态模块支持)

NGINX 1.9.11开始增加加载动态模块支持,从此不再需要替换nginx文件即可增加第三方扩展.目前官方只有几个模块支持动态加载,第三方模块需要升级支持才可编译成模块. [email protected]:~/nginx-1.12.0$ ./configure --help | grep dynamic --with-http_xslt_module=dynamic enable dynamic ngx_http_xslt_module --with-http_image_filter_mo

【转载】cocos2dx 中 Android NDK 加载动态库的问题

原文地址:http://blog.csdn.net/sozell/article/details/10551309 cocos2dx 中 Android NDK 加载动态库的问题 闲聊 最近在接入各个平台的SDK,遇到了不少问题,也从中了解了不少知识,之前一直觉得没啥好写的,毕竟做了4个月的游戏开发,也没有碰上什么真正的大问题,cocos2dx的引擎包得也很好,能让人把大部分时间都关注在游戏逻辑.效果的处理上,当然,之前的libevent还是小坑一下,但是和后来遇到的相比,也算不上什么了. 我最

Ubuntu linux设置从当前目录下加载动态库so文件

linux的excutable在执行的时候缺省是先搜索/lib和/usr/lib这两个目录,然后按照ld.so.conf里面的配置搜索绝对路径,linux缺省是不会在当前目录搜索动态库的.windows加载动态库的时候,缺省是首先加载本地目录下的动态库,然后再搜索windows/system和windows/system32目录. windows的动态库搜索顺序,虽然有可能会造成潜在的混乱,但是对于开发和测试无疑是比较方便的,尤其是debug和release版本的动态库需要经常切换进行测试的时候

浅谈DevExpress&lt;三&gt;:在GridView中加载动态图片

今天的演示效果如下:在GridView中的下拉框中选中一种颜色,则后面的加载相应的图片,如下图: 1. 2. 3. 下面说下实现方法:首先在项目中拉一个GirdControl,在里面创建4列:ID,Name,Color,Image,并将Color和Image分别创建repositoryItemComboBox和repositoryItemPictureEdit控件,如下图: 将一个图片文件夹放到程序的启动目录中: 文件夹中包含如下图片: 接下来进行创建数据模板,先创建一个Datetable,添加

Java类的加载の动态

类的加载方式 静态加载类,是编译时刻加载 动态加载类,是运行时刻加载 new创建对象:是静态加载类,在编译时刻就需要加载所有的可能使用到的类.有一个类有问题(如不存在),都不能通过编译,会报错. Class.forName(类的全称):通过动态加载类,用到一个类时,才进行加载. 功能性的类建议尽量使用动态加载,并对新添的类实现功能性接口(标准),这样就不用重新编译 import T1.OfficeAble; public class Office1 { public static void ma

Linux下c函数dlopen实现加载动态库so文件代码举例

dlopen()是一个强大的库函数.该函数将打开一个新库,并把它装入内存.该函数主要用来加载库中的符号,这些符号在编译的时候是不知道的.这种机制使得在系统中添加或者删除一个模块时,都不需要重新编译了.可以在自己的程序中使用 dlopen().dlopen() 在 dlfcn.h 中定义,并在 dl 库中实现.它需要两个参数:一个文件名和一个标志.文件名就是一个动态库so文件,标志指明是否立刻计算库的依赖性.如果设置为 RTLD_NOW 的话,则立刻计算:如果设置的是 RTLD_LAZY,则在需要

LoadLibrary加载动态库失败

LoadLibrary加载动态库失败的可能原因以及解决方案: (1)dll动态库文件路径不对.此场景细分为以下几种情况: 1.1 文件路径的确错误.比如:本来欲加载的是A文件夹下的动态库a.dll,但是经过仔细排查原因,发现a.dll动态库竟然被拷贝到B文件夹下去了. 若真遇到这种低级错误,建议你找个没人的墙角蹲下用小拇指逆时针划圈圈去吧... 1.2 实参传值错误.比如:实参类型为LPCWTR,经常都会因为字符串转换导致实参事与愿违. 网上的经验总结实例.某程序员经过一番周折后通过以下语句调用

jqGrid subGrid配置 如何首次加载动态展开所有的子表格

有时候需求需要默认加载表格的时候把子表格的数据也显示出来,经过研究相关SubGrids API配置如下: 属性 类型 描述 默认值 subGrid boolean 设置为true启用子表格.如果启用子表格,在父表格的左边会添加附加的列.此列包含一个“加”图片表示用户可以点击它展开行,默认所有行的子表格是收缩的. false subGridOptions object 子表格的配置,下面为配置的默认值 -收缩JavaScript代码 {plusicon : "ui-icon-plus",

macOS下加载动态库dylib报&quot;code signature invalid&quot;错误的解决办法

一.现象描述 在macOS上搞开发也有一段时间了,也积攒了一定的经验.然而,今天在替换工程中的一个动态库时还是碰到了一个问题.原来工程中用的是一个静态库,调试时发现有问题就把它替换成了动态库.这本来没什么值得一说,可工程编译完后打包测试时发现,不论怎么搞程序都加载不起来.毫无疑问,这是新替换的动态库带来的问题. 二.解决办法 于是尝试打开日志文件看看有什么发现吧: 根据上面的日志文件提示,动态库加载的时候失败了.原因为:code signature invalid.这就奇了个怪了,以前都没碰到类