Jquery及其组件
关注
分享
扫一扫
文章平均质量分 61
.NET跨平台
比较认真。编程就是算法和数据结构，算法和数据结构是编程的灵魂。
展开
-
如何实现带Timepicker的jQuery Datepicker选择器
您是否希望将日期时间选择器添加到您的应用程序中？通过添加带有日期的时间选择器，您的用户可以一起选择日期和时间。当您的应用程序需要存储日期和时间时，此功能很有用。在本文中，我们研究了如何在他们的网站上添加日期时间选择器。为了实现这个目标，我将介绍 2 个允许我们添加日期时间选择器的包。flatpickr我将为这两个包编写代码。您可以选择其中任何一个适合您的项目。翻译 2023-02-02 00:48:40 · 1606 阅读 · 0 评论 -
ASP.NET MVC中Unobtrusive Ajax的妙用
Unobtrusive Javascript有三层含义：一是在HTML代码中不会随意的插入Javascript代码，只在标签中加一些额外的属性值，然后被引用的脚本文件识别和处理；二是通过脚本文件所增加的功能是一种渐进式的增强，当客户端不支持或禁用了Javascript时网页所提供的功能仍然能够实现，只是用户体验会降低；三是能够兼容不同的浏览器。启用Unobtrusive Javascript的步骤：1.在web.config文件中加入<configuration> <appSe转载 2021-09-12 02:29:44 · 335 阅读 · 0 评论 -
jQuery delegate() 绑定多个元素或事件
delegate() 绑定多个元素或事件语法：$(selector).delegate(childSelector,event,data,function);childSelector: 可以是多个元素，要用逗号隔开，比如"p,span"，event： 属于什么事件，可以是多个事件属性，要用空格隔开，比如"click mouseover"，选中的元素既可以通过单击事件实现，用鼠标悬停也可以实现同样的效果。data: 可选，规定传递到函数的额外数据。function： 当事件发生时运行的函数。转载 2021-09-05 01:27:24 · 1143 阅读 · 0 评论 -
.net MVC内置js验证 jquery.validate.unobtrusive.js重置验证操作
(function ($) { $.validator.unobtrusive.parseDynamicContent = function (selector) { //use the normal unobstrusive.parse method //$.validator.unobtrusive.parse(selector); changed this line with $(selector).find('转载 2021-09-05 01:09:44 · 593 阅读 · 0 评论 -
jQuery.has() 函数详解
has()函数用于筛选出包含特定后代的元素，并以jQuery对象的形式返回。特定后代是指该元素至少有一个后代元素匹配指定的表达式。这里的表达式包括：选择器(字符串)、DOM元素(Element)、jQuery对象。该函数属于jQuery对象(实例)。语法jQuery 1.4 新增该函数。JavaScript:jQueryObject.has( expr )参数参数描述exprString/Element/jQuery类型指定的表达式。has()函数实际上是根据转载 2021-09-02 23:46:52 · 2688 阅读 · 0 评论 -
jQuery Migrate 插件用法
jQuery Migrate是应用迁移辅助插件，是用于高级版本兼容低级版本辅助插件。例如jQuery版本用的是1.x，计划升级到3.x，就可以在页面删除1.x版本，换成3.x版本，如果有脚本错误，就引入jquery-migrate插件用于兼容低版本，同时也显示低版本方法替换成新版本方法的方案。例子：<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>test转载 2021-07-10 15:46:36 · 1395 阅读 · 0 评论 -
JQuery DOM操作：设置内容&属性&添加元素&插入元素&包裹&克隆&移除&替换
JQuery text()、html()、val()$(elem).text(str):添加文本内容str到elem类型元素,返回jQuery对象$(elem).text():返回第一个elem标签内的文本内容$(elem).html("<a href='##'>a标签</a>"):添加html内容到elem类型元素,返回jQuery对象$(elem).html(""):返回第一个elem标签内的html内容$("input").val(str):给所有input标签设置值转载 2021-07-04 16:28:49 · 781 阅读 · 0 评论 -
jquery 每3个＜li＞就用一个＜ul＞包裹住，这样要如何写？最后不足3个li也能被＜ul＞包裹住
jquery，每3个<li>就用一个<ul>包裹住，这样要如何写？最后不足3个li也能被<ul>包裹住答案:// 写一行上$("li").slice($("li:nth-child(3n)").each(function(i){ $("li").slice(i*3,i*3+3).wrapAll("<ul></ul>");}).length * 3).wrapAll("<ul></ul>");// 分开写var转载 2021-06-29 16:36:50 · 326 阅读 · 0 评论 -
jQuery的事件命名空间-Namespaced Events
命名空间简单易懂的说就是为了避免混淆，恰似人类的姓+名。专业解释请看 http://zh.wikipedia.org/wiki/命名空间。命名就是取名，比如两个人都叫做小明，空间就是区分命名的，比如一个小明姓王，一个小明姓张。王，张的姓就是空间，命名+空间（姓，名合体：王+小明，张+小明），你就不会混淆到底在说哪个小明。jquery的事件命名空间，就是为了区分同一个jquery元素绑定的多个同名事件，使用方法就是: $.bind(“事件名.区分后缀”, function)，$.trigger(“事件名.转载 2020-11-28 23:57:26 · 322 阅读 · 0 评论 -
jQuery事件处理（六）
1、通过一步步调试的的方法观察了一下存放到cache中的事件及其处理程序的数据格式：{ events : { // 根据事件类型存放添加到该元素上的所有事件，下面以click为例 click : [ // click 事件类型。已数组的形式，按绑定的先后循序存放不同的事件处理函数相关内容（已对象的形式） { data : "", // 事件绑定时传入的data guid : 1, // jQuery分配的事件的id，用来转载 2020-11-28 23:41:30 · 197 阅读 · 0 评论 -
jQuery绑定事件监听bind和移除事件监听unbind用法实例详解
这里分别采用后bind(eventType,[data],Listener)//data为可选参数,one()该方法绑定的事件触发一次后自动删除，unbind(eventType,Listener),实例：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html><head&g转载 2020-11-28 16:14:32 · 1186 阅读 · 0 评论 -
jQuery+easing缓动的动画
jQuery实现动画再简单不过了，只是要实现更酷的效果还需要插件来帮忙，easing就是一款帮助jQuery实现缓动动画的插件，经过试用，效果很不错，记录一下使用方法吧！下载该插件：jquery.easing.1.3.js jquery.easing.compatibility.js方法介绍：def：默认方式设置swing：默认方式加载Quad：二次方缓动(t)Cubic：三次方缓动Quart：四次方缓动Quint：五次方缓动Sine：正弦曲线缓动Expo：指数曲线缓动Circ：圆形转载 2020-11-20 16:44:40 · 547 阅读 · 0 评论 -
Html5 jquery视频播放插件Video.js
<!doctype html><html><head> <meta charset="utf-8"> <title>Video.js 7.7.6示例</title> <link href="css/video-js.min.css" rel="stylesheet"> <style> body { background-color: #1转载 2020-11-15 11:41:50 · 1671 阅读 · 0 评论 -
jQuery param() 方法
实例序列化一个 key/value 对象：var params = { width:1900, height:1200 };var str = jQuery.param(params);$("#results").text(str);结果:width=1680&height=1050TIY 实例输出序列化对象的结果：$("button").click(function(){ $("div").text($.param(personObj));});<!DOCTY转载 2020-11-10 22:46:57 · 856 阅读 · 1 评论 -
jQuery ajax的traditional参数的作用
一般的，可能有些人在一个参数有多个值的情况下，可能以某个字符分隔的形式传递，比如页面上有多个checkbox：$.ajax{ url:"xxxx", data:{ p: "123,456,789" }} 然后后台获取参数后再分隔，这种做法有很大弊端，试问如果某一个参数值中出现了分隔符所使用的字符，会出现什么情况呢？当然后台获取的参数将与实际情况不符.这时我想到了将上述代码写成这样：$.ajax{ url:"xxxx",转载 2020-11-09 22:25:18 · 1778 阅读 · 0 评论 -
Ajax请求（$.ajax()为例）中data属性传参数的形式
首先定义一个form表单： <form id="login" > <input name="user" type="text"/> <input name="sex" type="radio" value="man"/> <input name="sex" type="radio" value="woman"/> interest: <input type="checkbo转载 2020-11-09 22:19:27 · 426 阅读 · 0 评论 -
jquery移除了live()、die(),新版事件绑定on()、off()的方法
新的绑定方法on()和比live()相比，效率比之前的高。因为live()是固定在document节点上的。如果绑定的元素嵌套在很深的层中，那么事件一级级的传递必将影响到效率。而on()是绑定在$()选择的元素上，嵌套深度可自由选择。on()的参数 on( events [, selector ] [, data ], handler(eventObject) )第二个参数可选，可以指定一个绑定的元素，例如:$(".box").die().on('click','button',function(){转载 2020-11-01 20:06:51 · 830 阅读 · 0 评论 -
jQuery框架常用的性能优化
jQuery作为一个JavaScript非常优秀的库是我们在学习前端过程中必学的虽然它的流行程度已经没有那么巅峰了但是学习了它对我们学习理解其他库以及框架来说很有帮助今天第一次写jQuery的相关文章，就先把这个性能问题拿出来因为大家把时间都用在jQuery语法上了，对这个库的性能优化不是很了解下面我来给大家总结一下jQuery常用的性能优化1.选择器使用jQuery提供了很多方便的选择器语法，介绍几个常用的及它们的性能排名id选择器 $(‘#id’)毫无疑问是最佳性能，因为它底层就直转载 2020-10-26 22:51:35 · 381 阅读 · 0 评论 -
jQuery性能优化指南
一、总是从ID选择器开始继承 <!-- 在jQuery中最快的选择器是ID选择器，因为它直接来自于JavaScript的getElementById()方法。如下：--> <div id="content"> <form method="post" action="#"> <h2>交通信号灯</h2> <ul id="traff转载 2020-10-26 22:34:03 · 198 阅读 · 0 评论 -
jQuery性能优化
前言，最近在写jquery的时候，出现一下性能相关问题，在此特作总结，以待日后多加注意。1.关于变量的定义这里不仅仅是jquery，即便是javascript都是一样的，一定要使用var（let/const）关键字来定义变量，不能定义成如下：$abc = $('#abc'); //这是个全局的定义，一旦在别处出现相同名字的引用就会报错，还不一定能找到错误来源如果有多个变量需要定义的时候，可以如下做：var item = 0, $ifr = $('#ifr'), $pop-class转载 2020-10-26 09:28:05 · 234 阅读 · 0 评论 -
jQuery 选择器效率
原文地址：http://www.cnblogs.com/aaronjs/p/3337531.htmlID > Tag > ClassID 选择器是速度最快的，这主要是因为它使用 JavaScript 的内置函数 getElementById()；其次是类型选择器，因为它使用 JavaScript 的内置函数 getElementsByTag()；速度最慢的是 Class 选择器，其需要通过解析 HTML 文档树，并且需要在浏览器内核外递归，这种递归遍历是无法被优化的。选择器性能优化转载 2020-10-25 11:13:27 · 495 阅读 · 0 评论 -
jquery multi-select和jQuery quicksearch使用
<html><head> <title></title> <link href="css/bootstrap.min.css" rel="stylesheet"/> <link href="css/multi-select.css" rel="stylesheet"/></head><body><select class='searchable' id='' multipl转载 2020-08-28 09:38:20 · 616 阅读 · 0 评论 -
用select2做级联下拉选择
用select2做级联下拉选择两个下拉框，通过选择年级下拉框进行查询该年级下的所有班级。可以对select添加onchage事件，监控下拉事件，下拉选择年级，把年级id传入后台查询出该年级下属班级，把班级列表展示到下拉框。js：$("#grade").change(function () { var grade= $("#grade").val(); $.ajax({ url:base + "/user/grade/list", dataType:转载 2020-06-17 15:40:51 · 1765 阅读 · 0 评论 -
Jquery属性选择器（同时匹配多个条件,与或非）
1. 前言为了处理除了两项不符合条件外的选择，需要用到jquery选择器的多个条件匹配来处理，然后整理了一下相关的与或非的条件及其组合。作为笔记记录。2. 代码<!DOCTYPE html><html><head> <title>Test multi selection</title> <script s...转载 2020-04-02 16:39:11 · 826 阅读 · 0 评论 -
Jquery的.contents()和.end()方法
.contents()返回: jQuery描述: 获得匹配元素集合中每个元素的子元素，包括文字和注释节点。给定一个jQuery对象，表示一个DOM元素的集合，.contents()方法允许我们通过DOM树中查找集合中的直接子元素，并根据匹配的元素创建一个新的 jQuery 对象。.contents()和.children()方法类似，只不过前者包括文本节点和注释节点，以及jQuery对象...转载 2020-03-12 23:19:53 · 800 阅读 · 0 评论 -
Jquery选择器与样式操作
jquery选择器jquery用法思想一选择某个网页元素，然后对它进行某种操作jquery选择器jquery选择器可以快速地选择元素，选择规则和css样式相同，使用length属性判断是否选择成功。$('#myId') //选择id为myId的网页元素$('.myClass') // 选择class为myClass的元素$('li') //选择所有的li元素$('#ul1 li s...转载 2020-03-10 23:24:55 · 462 阅读 · 0 评论 -
Jquery里attr()可同时设置多个属性值
attr() 方法也允许您同时设置多个属性。下面的例子演示如何同时设置 href 和 title 属性：实例 $("button").click(function(){ $("#w3s").attr({ "href" : "http://www.w3school.com.cn/jquery", "title" : "W3School jQue...转载 2020-02-20 09:26:52 · 3370 阅读 · 0 评论 -
jquery链式操作
jquery链式调用 - 层级菜单示例jquery对象的方法会在执行完后返回这个jquery对象，所有jquery对象的方法可以连起来写：$('#div1') // id为div1的元素.children('ul') //该元素下面的ul子元素.slideDown('fast') //高度从零变到实际高度来显示ul元素.parent() //跳到ul的父元素，也就是id为div1的元素...转载 2020-01-29 23:32:55 · 1138 阅读 · 0 评论 -
Jquery阅读全文(readmore.js)效果
jQuery点击阅读全文展开查看全部内容<!DOCTYPE html><html><head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <meta charset="UTF-8"> <title><...转载 2020-01-20 22:27:03 · 4435 阅读 · 1 评论 -
Jquery的parent和closet方法
jQuery 遍历 - closest() 方法<!DOCTYPE html><html> <head> <script type="text/javascript" src="/jquery/jquery.js"></script> <style> li { margin: 3px; padding: ...转载 2020-01-10 14:31:36 · 2034 阅读 · 0 评论 -
Jquery阅读全文
<!DOCTYPE html><html class="hb-loaded"><head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <meta charset="UTF-8"> <title></t...转载 2019-12-06 10:27:22 · 277 阅读 · 0 评论 -
jQuery hover() 方法
实例当鼠标指针悬停在上面时，改变 <p> 元素的背景颜色：<!DOCTYPE html><html><head><meta charset="utf-8"><title></title><script src="https://cdn.staticfile.org/jquery/1.10.2/j...转载 2019-10-30 15:37:12 · 602 阅读 · 0 评论 -
jQuery操作iframe中js函数的方法小结
1、jquery操作iframe中的元素（2种方式）var tha = $(window.frames[&quot;core_content&quot;].document).find(&quot;#trewuuu&quot;).html();var thb = $(&quot;#core_content&quot;).contents().find(&quot;#trewuuu&转载 2018-05-16 21:01:57 · 4231 阅读 · 0 评论 -
JQuery on()方法绑定动态元素的点击事件无响应的解决办法
$('#check_all').on('click' , function(){alert(1);});$("#yujinlist").append(html);count++; }以上代码执行时，点击#check_all时，alert一直没反应，后在网上查资料时，才知道on前面的元素也必须在页面加载的时候就存在于dom里面, 那原话是这样的：支持给动态元素和属性绑定事件的是live和on转载 2018-05-09 23:03:31 · 1161 阅读 · 0 评论 -
每个人都应该知道的jQuery的提示
jQuery的提示大家应该知道简单的窍门的集合，以帮助您的jQuery的游戏。提示使用 noConflict()检查是否加载的jQuery使用.on()绑定.click()代替返回顶部按钮预先载入图像检查，如果图像加载自动修复破碎的形象发布的AJAX表单悬停切换类禁用输入字段停止路径的负载缓存jquery选择淡入淡出切换/幻灯片简单手风琴让两个div相同的高度打开外部转载 2018-05-05 22:19:39 · 467 阅读 · 0 评论 -
jQuery Validate表单验证(用户注册简单应用)
1.讲解1.1 Validate 要依赖jQuery的，所以HTML中js的引用关系如下： <script type="text/javascript" src="../js/common/jquery-1.11.0.js" ></script> <script type="text/javascript" src="../js/common/jquery-valida转载 2018-04-16 15:46:08 · 1283 阅读 · 0 评论 -
Select2.js错误点总结
1、在做官网上的例子的时候，一直没有搜索框出来，一直都是普通的<select>标签实现的效果而已。纠结了好久好久都不知道是咋回事，后来打开浏览器的开发人员工具时，发现提示下图的错误： 才突然意识到，自己傻瓜了，Select2是基于jQuery的一个插件，没有引用jQuery，Select2肿么可能有用嘛！真是笨到家了-_-! 也怪自己不好，直接将官网给的代码写了一遍就直接运行了。 2、在实现给转载 2018-04-11 21:59:29 · 1716 阅读 · 0 评论 -
JQuery知识点
jQuery on() 方法实例向 <p> 元素添加 click 事件处理程序：$(document).ready(function(){ $("p").on("click",function(){ alert("段落被点击了。"); });});定义和用法on() 方法在被选元素及子元素上添加一个或多个事件处理程序。自 jQuery 版本 1.7 起，on() 方法是 bind()、live() 和 delegate() 方法的新的替代品。该方法给 API 带来转载 2018-03-25 15:53:04 · 289 阅读 · 0 评论 -
jQuery流程、步骤插件ystep.js使用(二)
stepDemo.html<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></ti原创 2018-03-10 15:45:45 · 4296 阅读 · 0 评论 -
jQuery流程、步骤插件ystep.js使用(一)
stepFirst.html<!DOCTYPE html><html><head> <title>ystep流程、步骤</title> <meta name="keywords" content="ystep,jQuery流程、步骤插件" /> <meta name="description" content="ystep,jQuer原创 2018-03-10 15:29:21 · 13878 阅读 · 0 评论