jQuery
关注
分享
扫一扫
栗子好好吃
向来心是看客心,奈何人是剧中人
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
算法 --- > 递归实现多级树展开结构
在项目中,经常会给出一个深度不确定的数组,数字结构如下: data = [ {name: 'a', child:[{name: 'a1'},{name: 'a2', child: [{name:'a21'}]}]}, {name: 'b'} ] 要求将数组渲染成对应的目录结构, 结构如下: <ul> <li> a ...原创 2020-02-08 18:21:08 · 1245 阅读 · 2 评论 -
jquery --- > 监听tab栏的变化
1. jQuery样式操作 1.1 操作css方法 参数只写属性名,则返回属性值(字符串) $(this).css('color') 参数是 属性名、属性值(逗号分隔，则表示设置属性 $(this).css('color','red') 参数可以是对象的形式 $(this).css({ width: 400px, height: 400px }) 1.2 设置类样...原创 2020-02-08 16:36:16 · 1158 阅读 · 0 评论 -
javascript --- > 瀑布流的实现
说明 源代码 1. 瀑布流 出现问题: 设计给的图片不是同一个尺寸大小,因此不能规则的放入到给定的DOM结构中.此时,需要使用瀑布流技术来解决这个问题 解决的思路: 让图片等宽、不等高 核心: 用到了定位 img { position: absolute; left: 最小的索引 * 图片的宽度; top: 最小的图片的高度; } 算法如下: ...原创 2020-02-07 19:38:00 · 252 阅读 · 0 评论 -
jquery --- > 阻止表单默认的提交行为,标准化表单的数据
表单如下: // .htm <form id="topics_new_form" method="post" action="/topics/new"> <div class="form-group"> <label for="exampleInputEmail1">选择模块</label> <selec...原创 2019-08-09 10:40:05 · 221 阅读 · 0 评论 -
jquery --- > 全选、全不选、反选、提交
注意:jquery 提供的$(’#id’).attr(‘checked’,true)方法,在某些情况下会失效… 因此,使用js原生的 .checked = true方法 控制 // html <form> 你爱好的运动是? <br/> <input type="checkbox" name="items" value="足球" /> 足球 ...转载 2019-07-17 23:13:40 · 169 阅读 · 0 评论 -
jquery --- > 事件处理函数的event对象的几个属性(方法)说明
1.event.type: 事件的类型 $('a').click(function(event) { alert(event.type); return false; // 阻止链接跳转 }); // click 2.event.preventDefault(): 阻止默认事件 $("#sub").bind("click", function(event) { var u...转载 2019-07-17 16:48:47 · 432 阅读 · 0 评论 -
jquery --- > 控制元素的隐藏/显示
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> </head> <body> <div id="panel"> <h5 class="head">什么是jquery?</h5> <div class="conte...转载 2019-07-17 15:56:57 · 155 阅读 · 0 评论 -
jquery --- > 网页选项卡
点击,不同的tab_menu,显示不同的tab_box 注意点: 1.获取ul下,当前li的编号. $(‘div ul li’).index(this) 2.显示ul下编号为$index的li -> $(‘ul li’).eq($index) <!DOCTYPE html> <html> <head> <meta charset="utf-8"&g...转载 2019-07-18 20:44:06 · 246 阅读 · 0 评论 -
jquery --- > 收缩兄弟元素
点击高亮的收缩子元素. 思路: 1.点击的其实是tr.(类为parent) 2.toggleClass可以切换样式 3.slblings(’.class’).toggle 可以根据其类来进行隐藏显示 代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> ...转载 2019-07-18 19:45:54 · 209 阅读 · 0 评论 -
jquery --- > 多选下拉框的移动(穿梭框)
效果如下: 几个注意地方: 1.多选下拉框需要添加 multiple 2.获取选中的元素KaTeX parse error: Expected 'EOF', got '#' at position 3: ('#̲id option:selec…(#id option:not(:selected)) 下面是代码的各个部分实现, 方便引用,最后是总体代码,方便理解 添加选中到右边: // 添加选中到...转载 2019-07-18 09:30:10 · 1257 阅读 · 0 评论 -
jquery--- > 属性和样式的操作 && 设置和获取HTML、文本和值、焦点事件
1.获取p元素的title属性: var title = $("p").attr("title"); 2.给p元素加title属性(值为:栗子)和date属性(值为:2019/7/15): $("p").attr("title":"栗子", "date":"2019/7/15"); 3.删除p中的title属性: $("p").removeAttr("title"); 4.给p添加class...转载 2019-07-15 20:24:57 · 258 阅读 · 0 评论 -
jquery --- > DOM操作、表单元素的初始化
基本过滤选择器: // 选取所有<div>元素中第一个<div>元素 $("div:first") // 选取所有<div>元素中最后一个<div>元素 $('div:last') // 选取class不是myClass的<input>元素 $('input:not(.myClass)') // 选取索引是偶数的<input&...转载 2019-07-15 16:44:31 · 572 阅读 · 0 评论 -
jquery --- > 监听input框失效
使用juery监听Input输入的变化,并且封装起来,如下: // html <input type="text" id=‘myinput1’ /> // js function formOnById(id){ let dom = '#' + id; $(dom).bind('input propertychange',()=>{ let i...原创 2019-05-30 11:13:21 · 1543 阅读 · 0 评论 -
jquery常见操作分享
参考: https://www.cnblogs.com/eager/p/7133270.html转载 2019-05-23 09:51:50 · 361 阅读 · 0 评论 -
jquery --- > pip方法
我们先来看下面一个例子: var getPromise = $.get('/query'); getPromise.done(function(data) { var postPromise = $.post('/search', data); }); // ...无法在此处给postPromise方法附加处理器 // 上面先使用get方法读取url为query的数据,在完成后,再使用p...转载 2019-05-27 10:59:03 · 569 阅读 · 0 评论 -
jquery --- > 使用when方法等待2个异步事件结束后执行某一个函数.
$.when(promise1, promise2) .done(function(args1, args2){ console.log(args1 + args2); } // 上述代码,等待promise1和promise2执行完,打印出(promise1和promise2)使用的参数 // 注:1.promise1和promise2是异步调用的函数,如ajax请求 // 2....转载 2019-05-27 10:31:36 · 2501 阅读 · 0 评论 -
jQuery --- > 简单操作合集
// 获取所有<p>元素 $("p"); // 获取一个ID为myDiv的<div>元素 $("div#myDiv"); // 获取所有type属性等于"text"的<input>元素 $("input[@type=text]"); // 获取所有p元素并隐藏它们 $("p").hide(); // 获取ID为myDiv的<div>元素,然后...转载 2019-03-23 09:19:48 · 137 阅读 · 0 评论