首页 » jQuery

关于 jQuery 的文章共有8条

jQuery动态append添加元素点击事件失效

jQuery动态append添加元素点击事件失效

问题描述:在div中动态添加span元素,之后执行 $(selector).click(function(){var param = $(this).text();}) 无法触发事件。 原因:append中的节点是在整个文档加载完之后开始添加,页面不会为append的元素初始化添加点击事件,故使用这种方式动态添加的节点中的click事件没有生效。 解决方案:事件委托方式解决,将指定的事件绑定在document上,只要append元素符合指定的元素,就会绑定此事件 。 $(document).on("click","指定的元素",function(){}); $(document).on("click", selector, function(){ var param = $(this).text();}) 转载于CSDN张小沫22

评论(0) 2020-2-26
fancybox3图片浮窗增强jQuery插件

fancybox3图片浮窗增强jQuery插件

介绍:用于呈现各种类型媒体的javascript lightbox库。响应灵敏,触控灵活,可定制。3.0主要就是功能多且美观官方给出的最快使用方法<!-- 1. Add latest jQuery and fancybox files --> <script src="//code.jquery.com/jquery-3.3.1.min.js"></script> <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css" /> <script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script> <!-- 2. Create links --> <a data-fancybox="gallery" href="big_1.jpg"><img src="small_1.jpg"></a> <a data-fancybox="gallery" href="big_2.jpg"><img src="small_2.jpg"></a> <!-- 3. Have fun! -->但是美中不足,我们希望内容文章图片直接增加属性还需要写一句代码<script> $('.message img').paren...

评论(0) 2019-9-30
jQuery ajax请求json数据回调函数中data为undefined解决方法

jQuery ajax请求json数据回调函数中data为undefined解决方法

首先要考虑json数据是否正确,dataType类型和返回类型是否一致今天写模板的时候用的ajax获取文章,调用标准api接口,可是总是出错,代码大概是这样的$.ajax({             async: false, //必须设置为false,同步才行             url: "api.php?route=article&page=" + page,             type: "get",             success: function(res) {                     var list = res.data;                     for (var i = 0; i < list.length; i++) {              &nbs...

评论(0) 2019-6-26
jquery设置与去除disabled属性的方法

jquery设置与去除disabled属性的方法

转载于csdn https://me.csdn.net/qq_40393093jquery设置与去除disabled属性的方法//两种方法设置disabled属性 $('#areaSelect').attr("disabled",true); $('#areaSelect').attr("disabled","disabled");//三种方法移除disabled属性 $('#areaSelect').attr("disabled",false); $('#areaSelect').removeAttr("disabled"); $('#areaSelect').attr("disabled","");在jquery中checked与disabled属性的操作方法基本相同。例如:jquery判断checked的三种方法:.attr('checked'):      //看版本1.6+返回:"checked"或"undefined" ;1.5-返回:true或false.prop('checked'):    //16+:true/false.is(':checked'):      //所有版本:true/false//别忘记冒号哦jquery赋值checked的几种写法:所有的jquery版本都可以这样赋值:$("#cb1").attr("checked","checked");$("#cb1").attr("checked",true);jquery1.6+:prop的4种赋值:1.$("#cb1").prop("checked",true);//很简单就不说了哦2. $("...

评论(0) 2019-6-23
简单理解jQuery中$.getJSON、$.get、$.post、$.ajax用法

简单理解jQuery中$.getJSON、$.get、$.post、$.ajax用法

1.$.getJSON  $.getJSON()是专门为ajax获取json数据而设置的,并且支持跨域调用,其语法的格式为:$.getJSON(       url,                 //请求URL        [data],           //传参,可选参数        [callback]       //回调函数,可选参数    );url:string类型, 发送请求地址   data :可选参数, 待发送 Key/value 参数 ,同get,post类型的data  callback :可选参数,载入成功时回调函数,同get,post类型的callback  JSON是一种理想的数据传输格式,它能够很好的融合与JavaScript或其他宿主语言,并且可以被JS直接使用。使用JSON相比传统的通过 GET、POST直接发送“裸体”数据,在结构上更为合理,也更为安全。至于jQuery的getJSON()函数,只是设置了JSON参数的 ajax()函数的一个简化版本。这个函数也是可以跨域使用的,相比get()、post()有一定优势。另外这个函数可以通过把请求url写 成"myurl?callback=X"这种格式,让程序执行回调函数X。  特别注意:$.getJSON是以GET方式提交数据,所以不能提交过大的数据量,可选$.post。至于如何修改为可用POST方式提交或者扩大GET提交数据量的问题,没有深入研究。//——项目中的实际案例 function changeAnswerShow(id){   ...

评论(0) 2019-5-18
jQuery电商网站楼层滚动定位

jQuery电商网站楼层滚动定位

转载于前端网<!DOCTYPE html> <html> <head>     <meta charset="UTF-8">     <title>jQuery电商网站楼层滚动定位</title>     <style type="text/css">         *{margin: 0;padding: 0;}         i{font-style: normal;}         ul,li,dl,ol{list-style: none;}         #LoutiNav{ border: 1px solid gray; width: 30px; position: fixed; top: 150px; left: 50px; display: none;}         #LoutiNav li{ width: 30px; height: 30px;border-bottom: 1px solid gray; line-height: 30px; text-align: center; cursor: pointer;}     ...

评论(0) 2018-8-10
jquery外链版本整理

jquery外链版本整理

jquery-2.1.1 (注!jquery-2.0以上版本不再支持IE 6/7/8)百度引用地址 (推荐目前最稳定的,不会出现延时打不开情况)百度压缩版引用地址:<script src=”http://libs.baidu.com/jquery/2.1.1/jquery.min.js”></script>微软压缩版引用地址:<script src=”http://ajax.aspnetcdn.com/ajax/jquery/jquery-2.1.1.min.js”></script>官网jquery压缩版引用地址:<script src=”http://code.jquery.com/jquery-2.1.1.min.js”></script>jquery-2.1.1下载jquery-2.0.0百度压缩版引用地址:<script src=”http://libs.baidu.com/jquery/2.0.0/jquery.min.js”></script>微软压缩版引用地址:<script src=”http://ajax.aspnetcdn.com/ajax/jquery/jquery-2.0.0.min.js”></script>官网jquery压缩版引用地址:<script src=”http://code.jquery.com/jquery-2.0.0.min.js”></script>jquery-2.0.3下载 jquery-2.0.0下载jquery-1.11.1百度压缩版引用地址:<script src=”http://libs.baidu.com/jquery/1.11.1/jquery.min.js”></script>微软压缩版引用地址:<script src=”http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.11.1.min.js”></script>官网jquery压缩版引用地址:<script src=”http://code.jquery.com/jquery-1.11.1.min....

评论(0) 2018-2-14
aos.js超赞页面滚动元素动画特效jQuery动画库

aos.js超赞页面滚动元素动画特效jQuery动画库

简要教程aos.js是一款效果超赞的页面滚动元素动画jQuery动画库插件。该动画库可以在页面滚动时提供28种不同的元素动画效果,以及多种easing效果。在页面往回滚动时,元素会恢复到原来的状态。演示http://michalsnik.github.io/aos/安装可以通过bower来安装aos动画库插件。bower install aos --save使用方法在页面中引入aos.css文件,jquery和aos.js文件<link rel="stylesheet" href="dist/aos.css" /><script src="js/jquery.min.js"></script><script src="dist/aos.js"></script>HTML结构要使用aos动画库,你需要做的就是在需要动画的元素上添加aos属性,例如:<div aos="animation_name">aos脚本将会在页面滚动时,在该元素上触发相应的动画。在元素上还可以添加以下一些属性:属性属性属性默认值aos-offset是立刻触发动画还是在指定时间之后触发动画200120aos-duration动画持续时间600400aos-easing动画的easing动画效果ease-in-sineeaseaos-delay动画的延迟时间3000aos-anchor锚元素。使用它的偏移来取代实际元素的偏移来触发动画#selectornullaos-anchor-placement锚位置,触发动画时元素位于屏幕的位置top-centertop-bottomaos-once动画是否只会触发一次,或者每次上下滚动都会触发truefalse注意,aos-duration的动画持续时间的范围从50-3000毫秒,如果你想设置更大的值,可以在页面中添加下面的CSS代码:body[aos-duration='4000'] [aos], [aos][aos][aos-duration='4000']{  transition-duration: 4000ms;}上面的代码将动画的持续...

评论(0) 2017-11-19