首页
学习
活动
专区
圈层
工具
发布

前端开发者都应知道的 jQuery 小技巧

在新窗口打开外部链接 找到文本元素 切换可视与隐藏的触发器 Ajax 调用的错误处理 链式操作 回到顶部按钮 通过使用 jQuery 中的 animate 和 scrollTop 方法...预加载图片 如果你的页面使用了大量不能初始可见的图片(例如绑定在 hover 上),预加载它们是十分有用的: $.preloadImages = function () { for...Hover 上的 Class 切换 如果用户的鼠标悬停在页面上某个可点击元素时,你想要改变这个元素的视觉表现。...,查看脚本是否在必须的 HTML 中正常工作。...; } }); Ajax 调用的错误处理 当某次 Ajax 调用返回 404 或 500 错误,就会执行错误处理。但如果没有定义该处理,其他 jQuery 代码或许会停止工作。

3.5K30
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    所有前端都必须知道的 jQuery 技巧

    前端是一个很繁杂的工作,在工作中会考虑到很多细节,也许有时候一个细节没有处理好,就会造成很大的麻烦。但是一些小技巧就能够避免。作为一个新手,即使掌握一个小技巧都能够节省很多时间。...以下几个 jQuery 技巧,也许你工作中能够用上。 1....悬停切换类   假设你希望当用户将鼠标悬停在可点击的元素上时,它会改变颜色。...禁用输入字段       有时候,你可能想要禁用表格的提交按钮或它的某一项文字输入直到用户执行了特定操作(例如,勾选 “我已阅读相关条款” 复选框)。... 设置 min-height,这意味着它可以比主 div 大但绝对不能比主 div 小。

    2.5K20

    bootstrapValidator 中文API

    当您要在自定义提交处理程序中提交表单时,可能会使用它。 破坏 destroy() - 破坏插件。 它将删除所有错误消息,反馈图标以及关闭插件创建的事件。...参数 类型 描述 field 字符串| jQuery的 字段名称或字段元素如果未定义字段,则该方法将返回所有字段的所有错误消息 validator 串 验证器的名称如果未定义验证器,则该方法返回所有验证器的错误消息...参数 类型 描述 field 字符串| jQuery的 字段名称或字段元素如果未定义字段,则该方法返回表单选项。 validator 串 验证器的名称如果未定义验证器,则该方法返回所有字段选项。...option 串 选项名称如果未定义,则该方法返回给定验证器的选项 getSubmitButton getSubmitButton(): jQuery - 返回显示点击的提交按钮的jQuery元素。...参数 类型 描述 field 字符串| jQuery的 字段名称或字段元素 validator 串 验证器名称 message 串 错误消息 updateOption updateOption(field

    14.8K50

    37个JavaScript基本面试问题和解答(建议收藏)

    这种技术的另一个特点是为全局变量提供一个容易引用(可能更短)的别名。例如,这通常用于jQuery插件。...,foo2()返回未定义而没有引发任何错误。...isInteger(x) { return parseInt(x, 10) === x; } 虽然这个基于parseInt的方法对许多x值很有效,但一旦x变得相当大,它将无法正常工作。...b)在这里,a [6]将输出未定义的值,但时隙仍为空,而不是未定义的。在某些情况下,这可能是一个重要的细微差别。...并不是每个值得聘用的“A”候选人都能够回答所有问题,能够回答所有问题的也不能保证是“A”候选人。最后,招聘仍然是一门艺术,一门科学 - 还有很多工作要做。

    4.1K10

    InstantClick,让你的网站快到起飞,PJAX技术

    技术来更改页面内容,这意味着: 你不能依赖DOMContentLoaded和jQuery.ready()这两个函数来触发相关事件(这两个事件在刷新整个页面的时候才会触发,但是你可以使用[InstantClick...如果您的网站可以处理额外的负载,选择 在鼠标悬停时预加载方式。 如果你的网站不能,选择在鼠标点击的瞬间预加载方式。您的网站的速度仍然会超过99%的网站。...因此,一些脚本可能需要调整才能与InstantClick正常工作。...例如,以下是如何使Google Analytics(网站统计与分析)(2013年末的代码)正常工作: ...当访问者缩放页面或旋转其设备时,该栏的大小和位置会自动调整,因此即使您的网站未针对移动设备进行优化,也会正常工作。

    4.6K20

    使用json2.js解决IE6、7、8不能使用jQuery JSON.stringify函数的问题

    ‍‍‍‍‍‍‍‍‍‍ 周末捣腾JSON提交数据,使用jQuery的JSON.stringify函数,使用Google Chrome浏览器、百度浏览器调试都正常,今天用户说IE和360浏览器提交不了...,调试了一下,发现使用IE内核的时候,语句JSON.stringify调用处报错:JSON未定义。...解决方案: 到https://github.com/douglascrockford/JSON-js (个别地区需要访问外国网站),使用其中的 json2.js 作为兼容。...这个JS中的函数将JSON对象转换成JSON字符串,专门解决 IE6、7、8不能使用 JSON.stringify 函数的问题。 在head之间,添加如下调用语句 ‍‍ ‍‍ 这样IE低版本下的jQuery JSON.stringify 便可以正常使用!

    1.8K20

    niRvana · 轻拟物主题4.8完美版

    【注:之前自定义的第三方插件使用的不刷新加载页面回调方法可能在使用此版本后需要将原来的方法更换为钩子】 v2.1.0 1、优化:一些常用方法可能存在BUG的隐患 2、优化:提示框框插件,可能存在BUG的隐患...2、REST API错误不再清空页面,而是显示错误提示 v1.4.2 1、修复:启用Ajax不刷新加载页面时,文章二维码封面显示后,使用返回按钮不消失的bug;鼠标悬停显示tooltip提示文字后,使用返回按钮不消失的...但以前插入的模块可能会出现无法编辑的故障。...v1.1.2 1、“小标题模块”内容显示错乱的问题 v1.1.1 1、文章分类页滚动图片可能不显示coverflow的问题 v1.1.0 1、文章分类禁用滚动图后,显示数据错误传入错误的问题 2、跨域CDN...图片无法生成封面的问题 3、文章内容较短而边栏很长时,在某些尺寸屏幕上出现的滚动问题 4、部分样式问题 5、部分插件无法正常使用jQuery的问题 6、引入Autoprefixer解决旧版浏览器前缀的问题

    10.1K10

    jQuery.noConflict() 深度剖析与应用指南

    为了应对可能出现的 $ 符号命名冲突, jQuery 提供了一个名为 jQuery.noConflict() 的方法。...假设在同一个页面里, 另一款库也使用 $ 作为命名空间入口, 那么就可能导致彼此覆盖对方的函数。这种状况会引发难以预料的错误。...如果没有任何其他库占用 $, 也会把 $ 重新置为未定义或其最初的值。...此时如果没有合理地处理命名冲突, 很可能导致原有的 $ 函数库与 jQuery 的函数都无法正常调用, 最终出现模块报错, 甚至让页面崩溃。...就像在团队协作里如何尊重并容纳彼此的工作, jQuery 通过 noConflict 这个方法告诉我们, 库与库之间也可以大度且从容地进行共存, 帮助开发者在复杂环境里优雅地应对命名冲突与版本兼容等诸多挑战

    26000

    JavaScript 加密混淆之后运行 xxxx is not defined

    0x0、xxxx is not defined 错误原因及解决方法 首先提示 xxxx is not defined 就是表示未定义。...发生原因: 如果你确定加密之前已经定义了这个“变量名”或者“方法名”,那应该是加密后“变量名/方法名”已经发生改变,导致外部调用的时候找不到这个“方法名/变量名”,才会出错误。...” 那肯定是未定义(test is not defined)。...符号可以看到具体的规则。这样加密后,这个“变量名/方法名”不会发生改变。就不会出现这个错误问题。2.提升作用域。...3.正确的书写(采用闭包) 我们都见过jquery,jquery就是采用闭包的方式书写。 简单来讲就是私有化所有方法(函数)和变量,然后提供公共访问方式。

    39110

    异步加载脚本保持执行顺序

    首先是外部脚本和行内脚本,对于异步加载的脚本,会导致竞争状态,使得出现未定义的错。...type="text/javascript"> var scriptElem = document.createElement('script'); scriptElem.src = "js/jquery...2.如果页面有更多的资源,那么外部脚本可能在onload时间出发之前早就完成加载,一般来说,行内脚本最好在外部脚本下载和执行完成之后立即调用。...多个脚本按序执行: 正常引入脚本: 运行结果: ? ? 采用XHR eval: 运行结果: ? ? 由于脚本没有按顺序执行,出现未定义的错误。...由于document.write Script Tag在并行下载脚本时会阻塞其他资源,而Script Dom Element则只在FireFox(实际测试FireFox并不行,可能是版本原因)和Opeare

    2.3K20

    C++ 中 malloc 申请的内存,可以用 delete 释放吗?

    C++中malloc和delete的混用问题直接回答不可以!malloc申请的内存不能用delete释放,这是未定义行为(UndefinedBehavior)。...可能导致崩溃//❌错误:new+freeMyClass*ptr4=newMyClass();free(ptr4);//未定义行为!...可能://1.程序崩溃//2.内存损坏//3.看似正常但存在隐患return0;}可能的问题:delete会尝试调用析构函数(对于类类型)delete可能检查内存的内部标记,发现不匹配堆管理器可能崩溃或产生内存损坏...析构函数未被调用}//结果:internalData内存泄漏return0;}特殊情况:POD类型对于POD(PlainOldData)类型,混用可能"看起来"正常,但仍然是未定义行为:展开代码语言:C..."正常Point*p1=(Point*)malloc(sizeof(Point));p1->x=10;p1->y=20;deletep1;//未定义行为,但可能不会立即崩溃Point*p2=newPoint

    8810

    警惕C++内存管理的陷阱:为什么newdelete必须与new严格匹配?

    new[]可能在指针前存储了元数据)结果分析:对于平凡类型(如POD类型):可能"侥幸"正常运行,但这是未定义行为,具有极差的移植性对于非平凡类型:导致资源泄漏和潜在的堆损坏,是更隐蔽、更危险的错误二、...技术深度:操作符的底层工作机制为了理解为什么必须严格匹配,我们需要了解这些操作符的实际工作方式:操作符执行步骤关键差异new1.分配单个对象的内存2.调用构造函数无额外元数据delete1.调用一次析构函数...案例2:堆损坏导致随机崩溃收起代码语言:C++运行AI代码解释//在调试环境中可能正常运行,但在生产环境随机崩溃int*values=newint[100];//...使用数组...deletevalues...;//未定义行为:可能破坏堆结构//后续的内存操作可能失败四、现代C++的最佳实践为了避免这类问题,现代C++推荐使用RAII(ResourceAcquisitionIsInitialization)原则和智能指针...注意:本文描述的未定义行为具体表现可能因编译器、操作系统和运行时环境而异,但无论如何,结果都是不可接受的。安全编程的第一步就是避免所有未定义行为。

    21410

    chrome插件开发教程

    越来越多的前端开发人员喜欢在Chrome里开发调试代码,Chrome有许多优秀的插件可以帮助前端开发人员极大的提高工作效率。...尤其Chrome本身是可以登录的,登录后你所有的插件都会自动同步到每一个登录后的Chrome的,非常方便啊。...JavaScript Errors Notifier 安装该扩展后,会在Chrome地址栏中以图标形式提示JavaScript错误,因为Chrome默认只有打开console才会显示错误。...这是一个开发者最喜欢的Firefox扩展Firebug的精简版。 JQuery 扩展 jQuery扩展让你在当前网页中运行JavaScript和jQuery命令。...WhatFont 用于查看当前页面使用了哪些字体,Firebug和Webkit Inspector也可以查看字体,但是远没有WebFont方便,WebFont可以通过把鼠标悬停在元素上来查看字体。

    2.4K30

    JavaScript 数据类型

    一、基本数据类型 javascrip含有五种基本数据类型:undefined,null,boolean,number和string。...) null:空类型,其仅有一个值:null undefined:未定义,其仅有一个值:undefined typeof关键字:由于Javascript中的变量是松散类型的,所以它提供了一种检测当前变量的数据类型的方法...,所以不能给字符串添加属性,并且instanceof检测对应类型时均返回 false: 1 var person = "Tom"; 2 person.age = 21; 3 console.log(person.age...Array:数组类型,以数字为索引的一组值的有序列表 Date:日期和时间类型 Error:运行期错误类型 Function:函数类型 RegExp:正则表达式类型  可以用new来实例化每一个对象,或者用字面量形式来创建对象...若要删除一个属性,用delete操作符,用于删除自有属性,不能删除原型属性: 1 p1.toString = function(){ 2 console.log("p1对象"); 3 }; 4

    89680
    领券