开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

使用jQuery更改data-src值不起作用

可能是由于以下几个原因：

语法错误：请确保你的jQuery代码没有语法错误。检查拼写错误、缺少分号、括号不匹配等问题。
元素选择错误：请确保你选择了正确的元素来更改data-src值。可以使用合适的选择器来定位到目标元素。
元素不存在：如果目标元素不存在于DOM中，那么更改data-src值当然不会起作用。确保目标元素已经加载到页面中。
data-src属性不存在：如果目标元素没有data-src属性，那么更改它的值当然不会起作用。可以先检查一下目标元素是否具有data-src属性。
jQuery版本问题：如果你使用的是较旧的jQuery版本，可能存在一些兼容性问题。尝试升级到最新版本的jQuery，或者查看jQuery文档以了解是否有特定版本的限制。

如果以上方法都没有解决问题，可以尝试使用其他方法来更改data-src值，比如使用原生JavaScript的setAttribute方法来修改元素的属性值。

关于jQuery和前端开发的更多信息，你可以参考腾讯云的前端开发产品和服务：

腾讯云Web+：提供全托管的Web应用托管服务，支持前端开发和部署。详情请参考：Web+产品介绍
腾讯云CDN：提供全球加速的内容分发网络服务，可以加速网站的静态资源加载。详情请参考：CDN产品介绍

希望以上信息能对你有所帮助！

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

Vue 中使用 JQuery 插件不起作用

有时候在 vue 的代码中使用 jQuery 会不起作用，这是因为 vue 还没有绑定变量，所以我们使用的 jQuery 根本就找不到目标变量，就不会执行，正确的做法是先设置一个时延，稍微等一等 vue...界面的渲染需要等 VUE 绑定好变量后才做，我们可以使用 setTimeout 函数做一个时延： // 界面的渲染需要等 VUE 绑定好变量后才做: 所以加延时 100 ms setTimeout(function

2.2K3 1

06-移动端开发教程-fullpage框架

比如：全屏滑动案例下面我们就介绍一下jQuery的fullPage.js的如何使用及常用的配置。...2. fullpage.js的使用 2.1 兼容性 fullpage.js是jQuery的插件，需要依赖jQuery，要求jQuery最低的版本是1.6+。浏览器能兼容到ie8+及其他现代浏览器。...true 是否使用插件的滚动方式，如果选择 false，则会出现浏览器自带的滚动条 scrollOverflow 布尔值 false 内容超过满屏后是否显示滚动条 css3 布尔值 false 是否使用...true 是否使用键盘方向键导航 touchSensitivity 整数 5 continuousVertical 布尔值 false 是否循环滚动，与 loopTop 及 loopBottom 不兼容...--图片或者视频的延迟加载, 只需要把src改成data-src --> <source data-src="video.webm

5.1K5 0

实现图片懒加载（及优化相关）

1、懒加载当客户端首屏不需要展示的图片，可以先不进行图片数据的请求，当图片的结构进入可视区域的时候，让这张图片进行显示监听scroll滚动，当滚动的距离 +首屏的高度 >元素距离浏览器顶端的高度值时...2、预加载幻灯片、相册等，可以使用图片预加载，将当前展示图片的前一张和后一张优先下载。初始化的时候获得图片的src之后为每一个元素提前添加图片的地址路径。...-- 使用data-*属性存放图片路径 --> 三、优化相关以上代码案例仅作为简单实现，实际使用中可以进行封装和优化，列举几栗：已经懒加载完成的元素添加指定class类名，防止重复监听使用防抖函数...，控制触发频率使用getboundingClientRect或IntersectionObserver（性能较好，但是有兼容性问题） jquery.lazyload.js ---- 标签：JavaScript

1.2K1 0

3分钟搞定图片懒加载

什么是图片懒加载图片的懒加载就是在页面打开的时候，不要一次性全部显示页面所有的图片，而是只显示当前视口内的图片，一般在移动端使用（PC端主要是前端分页或者后端分页）。...因此，通过html5自定义属性data-xxx先暂存src的值，然后在需要显示的时候，再将data-xxx的值重新赋值到img的src属性即可。.../images/10.jpg"> </script...思路：当页面滚动的时候需要去监听scroll事件，在scroll事件的回调中，判断滚动条是否滚动到最底部，如果是，则将将图片的 src 属性设置为data-src的值。...这里使用一个模拟接口来获取数据： https://www.apiopen.top/meituApi?page=1 page为页码数，一次返回20条数据。

2.4K2 0

06-移动端开发教程-fullpage框架

比如：全屏滑动案例下面我们就介绍一下jQuery的fullPage.js的如何使用及常用的配置。...2. fullpage.js的使用 2.1 兼容性 fullpage.js是jQuery的插件，需要依赖jQuery，要求jQuery最低的版本是1.6+。浏览器能兼容到ie8+及其他现代浏览器。...true 是否使用插件的滚动方式，如果选择 false，则会出现浏览器自带的滚动条 scrollOverflow 布尔值 false 内容超过满屏后是否显示滚动条 css3 布尔值 false 是否使用...true 是否使用键盘方向键导航 touchSensitivity 整数 5 continuousVertical 布尔值 false 是否循环滚动，与 loopTop 及 loopBottom 不兼容...--图片或者视频的延迟加载, 只需要把src改成data-src --> <source data-src="video.webm

5.1K9 0

基于jQuery或Zepto的图片延迟加载插件

事件，当图片在可视区域时，使用data-src替换src，加载真正的图片。...使用实际使用时一般使用已经存在的插件，如lazyload插件。...lazyload插件网上能搜出很多，常见的是： 1、jquery.lazyload.js: 依赖jQuery JavaScript /*!...> 2、使用 Markup <!...属性 event: 'scroll',//默认值 container: $(".content"), //一般无需指定，即window。

3.2K2 0

元素滚动高度和图片懒加载

页面body的offsetWidth和height是加border的值，要包括padding的值 ?...如果想学习懒加载的朋友，建议直接观看这篇文章实现图片懒加载(Lazyload)，这篇文章写得很好，懒加载主要是使用于图片比较多的情况，一次性加载所有的图片会给服务器比较大的压力，加载比较慢，所以我们先不加载未出现在页面可视区域内的图片...懒加载主要有3个步骤： 1、把所有图片的src值换成另外一张图片的src值，把真正的src值放在data-src内 2、判断元素是否从下方出现在可区域，$(node).offset().top<=$(window...滚动时offset的值，offset().top为元素距离页面内容的高度 ? 3、把图片data-src换成src值 <meta charset

1.6K2 0

在使用vue的项目中对于性能优化的处理

// 引入一组图片 import(URL), webpack2官网推荐使用, 属于es7范畴, 需要配合babel的syntax-dynamic-import插件使用 7.路由页面缓存使用vue-router的keep-alive

9822 0

小案例：结果缓存无法使用，RESULT_CACHE_MAX_SIZE值无法更改的问题

最近遇到了一个 RESULT_CACHE_MAX_SIZE 参数值无法更改的问题。首先我们需要知道 RESULT_CACHE_MAX_SIZE 是什么。...RESULT_CACHE_MAX_SIZE 是结果缓存能够使用sga内存的最大大小的限制参数。当我们需要使用结果缓存的时候，这个值一定不能是0。并且以下的查询结果是 ENABLED ....from dual; STATUS ------------------------------------- BYPASS 并且这种状态下RESULT_CACHE_MAX_SIZE参数值无法被更改...可以使用如下方法恢复。给shared_pool_size一个最小值。保证结果缓存可以拿到内存空间。...就可以解决无法使用结果缓存和无法修改RESULT_CACHE_MAX_SIZE参数值的问题了。

1.7K1 0

那些延时加载图片的开源插件

目前图片在网站中大量使用，如果不加处理的话会对服务器和带宽造成级大压力，通过只渲染当前用户可见区域的图片，可以极大地减少网站的请求数，降低网络带宽资源。...unveil 这是一款十分轻量级的片时图片加载组件支持现代浏览器及IE7+, Github上面有将近3K个star(关注) 使用一般图片 <img src="bg.png" data-src...使用引用jQuery和lazyload.js <script src="<em>jquery</em>.lazyload.js...不依赖<em>jQuery</em>，压缩后仅2K。...=') return imgstr }) ---- 往期精选文章 <em>使用</em>虚拟dom和JavaScript构建完全响应式的UI框架扩展 Vue 组件 <em>使用</em>Three.js制作酷炫无比的无穷隧道特效

9764 0

Fancybox图片灯箱效果实现

Fancybox是一款基于jquery开发的类Lightbox插件，同时也是一款很绚丽的 jquery 弹出层展示插件，支持对放大的图片添加阴影效果，对于一组相关的图片添加导航操作按纽。...安装文档：https://fancyapps.com/docs/ui/installation 你可以前往官方下载到本地引入，也可以使用其他CDN库或直接使用下方泽以创建的CDN：在网页的头部引入css...默认值：'toggleZoom' 可能的值：toggleZoom、、next或 closenull`。 doubleClick {String|null} 在图像上检测到双击事件时要执行的操作。...默认值：null. 可能的值：toggleZoom或 null。 wheel {String|null} 在图像上检测到双击事件时要执行的操作。默认值：zoom 可能的值：zoom、slide或。...默认值：contain 可能的值 contain：contain-w或 cover。

2.5K2 0

jQuery 图片查看插件 Magnify 开发简介（仿 Windows 照片查看器）

前言因为一些特殊的业务需求，经过一个多月的蛰伏及思考，我开发了这款 jQuery 图片查看器插件 Magnify，它实现了 Windows 照片查看器的所有功能，比如模态窗的拖拽、调整大小、最大化，图片的缩放...> Magnify 默认使用 font-awesome 的图标，所以需要引用 font-awesome... <img data-magnify="gallery" data-src...的 HTML 结构包含以下几个选项添加 data-src 属性可以链接到大图。...如果在标签中使用，它会覆盖 href 属性的值。添加 data-caption 属性可以显示标题。如果你不使用这个属性，插件会显示 URL 中的图片名。

3.2K9 0

asp.net :使用jquery 的ajax +WebService+json 实现无刷新去后台值

首先贴上Jquery的ajax： $.ajax({ url: 'ws_Ajax.asmx/BindDictByUpper', type...return jsonString.ToString(); } ScriptMethod在 using System.Web.Script.Services 命名空间下，这里还可以设置是否使用...get方式来调用 UseHttpGet=true 然后尝试着运行，这是出问题列，无论怎样运行都不能调到后台方法：最后在网上查列好久才发现在新建的webservice页少了一句关键的话： // 若要允许使用...但又出现问题列，发过来的数据不能以解析出来json数据按网上说的，只要把ajax中的dataType设置为json就行了，但是实际上不行，然后在网上查了下： 1、对于服务器返回的JSON字符串，如果jquery...异步请求没做类型说明，或者以字符串方式接受，那么需要做一次对象化处理，方式不是太麻烦，就是将该字符串放于eval()中执行一次 2.对于服务器返回的JSON字符串，如果jquery异步请求将type（

3.8K6 0

用 Cricket 在 Java 环境里构建极简的内容管理服务器

除此之外，这一方案还有个优势，那便是它能轻松安全地更改单个适配器的实现方法。比如我们可以很方便地更改数据库的类型，或者用一个外部消息中继器来取代内置的解决方案。...检查主页（http://127.0.0.1:8080）的内容是否已更改为上述文档所指定的内容注：在以这一章节的模式启动时无需重启服务。CM 模块中的文档更改会立即显示在网站上。 4....-- SCRIPTS: jQuery first, then Bootstrap JS, then Riot --> <script data-src="/local...这对希望用这个平台的人来进行一些测试（比如说：修改静态页面的模板，更改数据库，或是使用自己的后端组件来扩展这一平台等）的人来说也是一种可行的选择： 1.

1.4K5 0

懒加载

demo: //所有img元素的src属性值是同一个图片地址，自定义属性data-src里存储的是真正需要加载的图面地址，当图片出现在浏览器的可视区域内时，再把data-src的属性值赋值给对应的img...[](http://www.tongyizhangtupian.jpg) 2.为什么要使用懒加载? 很多页面，内容很丰富，页面很长，图片较多。比如说各种商城页面。...懒加载的原理就是先在页面中把所有的图片统一使用一张占位图进行占位，把正真的路径存在元素的自定义属性“data-src”（这个名字起个自己认识好记的就行）里，要用的时候就取出来，再设置。...3)在滚动事件中重复判断图片是否进入视野，如果进入，则将data-src属性中的值取出存放到src属性中。 5.懒加载的优点是什么?.../jquery-3.1.0.js"> /* 1.对于所有的img标签，把真实的地址放入自定义属性data-img

1K4 0

jQuery动画与ajax

由于jQuery 对象上的方法最后会返回该对象，jQuery的链式调用就是可以在对象返回后再次调用该对象使用jQuery方法的一种操作。...5. jQuery AJAX中缓存怎样控制当使用GET方法发送数据时，ajax的参数cache默认设置为true，将缓存页面；将cache设置为false，浏览器将不会缓存页面，每当发起ajax请求时...当使用POST方法时，则每次都会被认为是新的请求，不会缓存页面。...6. jQuery 中 data 函数的作用作用：在匹配元素上存储任意相关数据，或返回匹配的元素集合中的第一个元素的给定名称的数据存储的值。...', title:'follow your heart' }); 4.给$node 添加自定义属性data-src $node.attr('data-src','string') 5.在$ct 内部最开头添加元素

2.8K3 0

音乐播放器-图片切换-轮播图效果

40px; border: 1px solid #d1d1d1; text-align: center; line-height:40px; } 1 <li data-src...="2.mp3"; audio.paly(); } }); $(".volume").on("click",function(){ //取出自定义属性上的值，

5722 0

jQuery实现图片懒加载

懒加载的原理就是先在页面中把所有的图片统一使用一张占位图进行占位，把正真的路径存在元素的自定义属性“data-src”（这个名字起个自己认识好记的就行）里，要用的时候就取出来，把它的值赋值给img的src...()不适用于window 和 document对象，对于window 和 document对象可以使用.height()代替。...获取滚动条的滚动高度值：document.documentElement.scrollTop 获取滚动条的滚动高度值： document.body.scrollTop 获取滚动条的滚动宽度值： document.body.scrollLeft...return true; } return false; } 效果展示 6、使用...jQuery实现懒加载 <!

13.6K2 0

python测试开发django-186.使用 jquery 的 .val() 无法获取input框的输入值(已解决)

前言在使用 jquery 可以定位到元素， input框也输入了值，但是用.val()无法获取到输入框的值。...class="form-control" placeholder="项目名称"> 通过id属性可以定位到元素，并且只有一个 $('#project_name') .val() 获取输入框的值却为空

2.8K3 0

【前端JQ】使用js或jquery使button按钮变为不可用状态，并改变button上的值。

disabled=true; JQ方法： $("#btn").attr("disabled", true); 设置按纽状态最常用的地方就是获取短信验证码，为了防止用户不停的去获取，我们需要在用户点击获取之后把按纽的值设置为不可用...顺便把更改button值的JQ也记录一下： $("#dcButton").val("这样可将BUTTON值替换。");

6.3K3 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭