赵佳敏的博客

jQuery里面的事件一、$.get()方法1. 不需要传递数据2. 需要传递数据二、$.post()方法三、$.ajax()方法四、$.getJSON()五、$.getScript()一、$.get()方法jQuery.get(url, [data], [callback], [type])通过远程 HTTP GET 请求载入信息。这是一个简单的 GET 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数，请使用 $.ajax。jQuery 1.12 .

一、效果图二、核心代码前端 searBtn.on("click",function(){ if(!searIpt.val()){ bgs.fadeIn(200); return; } getUser('http://127.0.0.1:8080/syssearch',searIpt.val()); }); .

一、效果图二、核心代码前端创建元素的方法 //创建元素的方法 function createPage(files) { for (var i = 0; i < files.length; i++) { var fileList = $("<div class='filelist_info'></div>"); var id = $("&l.

一、效果图二、核心代码树形结构菜单.html<script src="js/treemenu.js"></script> <script> //插件中的方法使用和配置 //使用Ajax后端返回菜单的数据 //下面用户可能设置相关配置 $("#menu").Init({ backGround: "#4667d8", color: '#fff', data: menu .

一、效果图二、核心代码碎片轮播.html<script src="js/suiBanner.js"></script> <script> //实例化整个对象 var suiBanner=$('.box').initBanner({ imgs: ['images/1.jpg', 'images/2.jpg', 'images/3.jpg', 'images/4.jpg', 'images/5.jpg'], //图片集合.

jQuery实现飞机大战小游戏一、效果图二、核心代码1.创建地图2.用户选择飞机界面3.设置背景循环4.创建飞机5.创建敌机6.敌机移动7.设置敌机爆炸8.创建子弹9.检测子弹的移动（是否打到敌机）10.设置敌机被消灭的情况一、效果图二、核心代码1.创建地图 this.createMap = function () { var that = this; that._bg = $("<div.

jQuery实现树形员工信息表一、效果图二、核心代码一、效果图二、核心代码 var list = [ { name: "技术部", child: [ { name: "用户一" }, { name: "用户二" .

jQuery实现抖音钟表转盘动画一、效果图二、注意点三、核心代码一、效果图二、注意点1.jQuery动画暂不支持css3属性2.时间看的是水平线上方，所以时分秒的时间要-13.当秒和分的值转到60时，即0时，timearr[3]-1以及timearr[2]-1为负数，所以要设置当秒或分为0时，设置他为60；当时的值转到24时，即0时，timearr[1]-1为负数，所以要设置当时为0时，设置他为244.秒和分可以转到60，转到60的时候她有反着转转到了1，因为60已经转到了360度.

$(function(){ var speed=1000; var way=true; var width=200; $("#start").click(function(){ animate(); }); function animate(){ $("ul>li").each(function(index){ var ...

Ajax实现百度搜索一、效果图二、核心代码一、效果图二、核心代码 //搜索接口：http://www.baidu.com/s?wd=? //关键字联想搜索：https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd="+val+"&cb=callback var script,list,info; window.onload=function(){ list=documen.

js正则实现用户登录注册一、效果图二、实现思路三、核心代码一、效果图二、实现思路第一步：分别对帐号、密码、验证码进行验证，先判断账号、密码、验证码的值是否存在，不存在则引出对应error信息。第二步：如果值存在，使用正则判断值是否符合要求，正确输出信息，不正确输出error的信息。第三步：设置表单失焦出现对应的error信息，获焦移除当前的error。第四步：表单提交的时候，按钮进行获焦，如果没有错误信息就进行提交，并且清除所有信息。三、核心代码 &lt.

js实现九宫格抽奖一、效果图二、实现思路三、核心代码一、效果图二、实现思路第一步：先建立所有奖品的集合，设置随机奖品的索引第二步：设置转圈的圈数第三步：给选到的奖品变换颜色第四步：设置转圈的速度，由慢到快，再由快到慢三、核心代码 //点击开始抽奖 var item9=document.querySelector(".item-9"); var item=document.querySelectorAll(".item"); var i.

js实现转盘抽奖一、效果图二、设计思路三、核心代码一、效果图二、设计思路第一步：先建立所有奖品的集合，设置默认转的圈数第二步：设置转动的随机角度第三步：转动到哪里就是最后的奖品，使用浏览器弹框弹出第四步：设置每一个奖品转到的概率三、核心代码 //先建立所有奖品的集合 var list=['免单4999元', '免单50元', '免单10元', '免单5元', '免分期服务费', '提高白条额度', '未中奖']; //抽奖的状态 var .

js实现生日倒计时一、效果图二、核心代码一、效果图二、核心代码 window.onload=function(){ //倒计时的时间 var dtime=new Date("2021/11/29 00:00:00"); time=setInterval(function(){ //获取当前的时间 var ntime=new Date(); var c=dtime.g.

//产生随机色 var arr=['A','B','C','D','E','F',0,1,2,3,4,5,6,7,8,9]; function randomColor(){ var str="#"; for(var i=0;i<6;i++) { var index =Math.floor(Math.random()*arr.length); str+=arr[index]; ...

js数组案例---五子棋一、效果图二、设计思路三、核心代码一、效果图二、设计思路第一步：创建棋盘，生成棋盘所对应的数组坐标。第二步：鼠标点击当前位置返回当前点的坐标。第三步：生成对应的棋子。第四步：添加悔棋、重新开始事件。第五步：设置棋子输赢，若某个棋子五个连成一条线，则该棋子赢。三、核心代码 //1.创建棋盘 var item = document.querySelector(".item-map"); var itemchild = docum.

js计时器实现拖拽滚动一、效果图二、实现思路三、核心代码一、效果图二、实现思路第一步：使用循环计时器和一次性计时器实现图片轮播的动画效果。第二步：设置鼠标进入，动画停止，鼠标离开，动画继续。第三步：设置鼠标按下进行拖拽，然后检测用户鼠标移动的差值 ，大于图片一半宽， 直接下一张，小于一半直接返回当前的图片。第四步：遍历图片底下的小按钮，鼠标进入到那个权，当前圈变红并且出现对应的图片。三、核心代码 var timer,Item,Box,sx,ex,cha,List.

js实现上下滑动轮播一、效果图二、设计思路三、核心代码一、效果图二、设计思路第一步：遍历所有的元素使得鼠标点击右侧小图时，图片变亮并且根据偏移值加上红框。点击右边的小图左边出现对用的图片。第二步：利用循环计时器，克隆ul里面的第一个元素使得连续循环滑动。第三步：鼠标进入时循环滑动停止，离开时继续。第四步：设置上下按钮，当第一张图片的offsetTop值为0时，下面按钮出现，当到达底部最后一个元素时，上面按钮出现，底部按钮消失，当在整个元素中间时，上下按钮都出现，每点击一次按钮移动一.

带滚动条的无缝滚动一、效果图二、设计思路三、核心代码一、效果图二、设计思路第一步：克隆两个ul，使用循环计时器进行无缝滚动第二步：设置滚动的速度和时间第三步：设置鼠标进去box停止滚动，离开继续滚动。第四步：设置按钮拖动的函数，滚动条拖动，上面动画跟着移动，鼠标抬起，按照原先的速度进行滚动。三、核心代码<script> //接收计时器 var time; //速度变量 var speed=2; var timer=10.

js计时器案例--无缝滚动动画一、效果图二、实现思路三、主要代码一、效果图二、实现思路第一步：通过克隆节点复制两个ul，通过计时器让他实现无缝滚动。第二步：设置滚动的速度以及时间。第三步：实现鼠标进入滚动停止，离开继续进行无缝滚动。三、主要代码<script> var box=document.getElementsByClassName("box")[0]; var nav=document.getElementsByClassName("na.

@TOC一、数据的瀑布流加载<script> //模拟数据 var stulist = []; var nowPage=1; var pageNum=10; var totle=Math.ceil(stulist.length/pageNum); var parEle=null; window.onload=function (){ parEle=document.getElementsByClassNam.

PC端购物车一、案例效果二、实现步骤三、核心代码一、案例效果二、实现步骤a. 实现全选反选功能，点击选中当前行变色。b. 给加减按钮添加事件以及给文本框添加事件。c. 给小计添加事件。d. 实现删除功能，全部删除、选中删除、当前行删除。e. 实现商品总件数计数以及商品总价的功能。三、核心代码//网页加载完成，先获取购物车的数据，进行动态绑定渲染界面 var ckall=null; var cklist=null; var fanck=null; var item.

省市区三级联动一、简单的三级联动二、复杂的三级联动一、简单的三级联动<script> //三级联动简单写法 //记录第一个索引 var index1; //记录第二个的索引 var index2; //记录动态数据 var data1; var data2; //加载完成之后动态绑定数据 //获取上面三个元素 var s1=document.getElementById("s-1"); .

<script> //接收所有按钮的变量 var btnlist=null; //接收所有屏幕上的值 var screenIpt=null; //接收用户的屏幕值和符号值 var result=""; //设置一个Boolean类型的值 var ischange=null; //浏览器加载完成事件 window.onload=function(){ //获取元素 btnlist=doc

数据分页算法一、分页算法二、百度分页算法三、带数据的分页算法一、分页算法<script> <!-- 分页的逻辑算法--> //当前页和总页码 var nowPage=10; var totlePage=20; var navEle=null; var up=null; var down=null; var totle=null; var go=null; var num=null; .

一、产生随机色<script> <!-- 随机十六进制颜色值A-F(65-70) 0-9--> function randomColor(){ var item=[0,1,2,3,4,5,6,7,8,9,'A','B','C','D','E','F']; var color="#"; //产生随机色 for(var i=0;i<6;i++){ var index=Math.

目录一、案例效果二、实现步骤三、核心代码一、案例效果二、实现步骤首先设置左右两个按钮，点击左边按钮往左滑，点击右边按钮往右滑，然后设置点击底下小图的效果，出现红框以及右下角出现√，再根据小图得到最终的中图以及大图，在小图上创建一个层（鼠标进入出现层，鼠标离开层消失），设置层的大小（要成比例），然后对层的坐标进行限制，然后再根据比例滑动层的时候对应出现大图的部分。三、核心代码 //获取所有的small_box var small_box = document..

京东侧边导航制作一、效果图二、实现思路三、核心代码一、效果图二、实现思路使用js代码获取所有的li，在鼠标进入当前li的时候出现详情页，离开消失，可以刚开始把详情页透明度设为0，鼠标进入时变成1，离开又变成0，然后再调用函数调整详情页的位置。三、核心代码 var li_list=document.querySelectorAll(".left_menu_list"); var showbox=document.querySelector(".child.

简单的选项卡制作一、效果如下二、核心代码一、效果如下点击选项卡几会出现相对应的页面。二、核心代码 for(var i=0;i<item.length;i++) { (function(n){ //关联自定义属性 item[n].index=n; item[n].onmouseenter=function(){ if(save){ .