选中和取消 选中一个 checkbox(复选框) 后,再次点击它,即可取消选中 选中一个 radio(单选按钮) 后,再次点击它,不能取消选中 的“单选”是不受其 name 属性的值的影响的,具体可以看下面的演示和代码 <!...radio单选和多选 默认情况下(不设置name属性时),也是点了几个 radio 就有几个 radio 被选中,并且选中后再次点击不可取消选中,除非重置或者刷新页面等 但 radio 既然是单选按钮...,还可以通过设置其 name 属性的值不相同来实现 如果有三个 radio 按钮,前两个的 name 属性的值是一样的,但第三个和前两个不一样,则前两个 radio 按钮,只能同时选中一个,第三个...radio 按钮可以和第一个或第二个同时被选中 <!
jQuery 实现复选框多选 页面代码 jQuery 到该页面中 var chkFirst = $('input[name="chkFirst"]'); var chkSec = $('input[name="chkSec..."]'); chkFirst.click(function() { // 这里的prop代替attr是因为prop可循环执行,而attr只能执行一次 // is函数判断对象属性,反坏true和false...true : false ); }); JavaScript 实现复选框多选 <!...chk" onclick="selectSingle();" />菜单四 javascript
本章简介 Ext JS是用于开发 RIA (富客户端)的Ajax应用,是使用JavaScript编写的、与后台技术无关的前端Ajax框架,主要用于创建前端用户界面。...同样,Ext 支持与 JQuery、YUI 或 Prototype整合使用,作为底层库的角色出现,提供处理各种核心的服务,如 DOM和事件处理、Ajax连接和动画特效。...图2.1.7 Ext 的 Panel 的构造函数 1.1.5 Ext事件 ExtJS提供了一套强大的事件处理机制,用于响应用户的动作、监控控件状态变化、更新控件视图信息、与服务器进行交互等。...复选框 Ext的复选框通过CheckboxSelectionModel对象实现,它在每行数据前添加一个复选框。...应用,是使用JavaScript编写的、与后台技术无关的前端Ajax框架,主要用于创建前端用户界面。
比如icon,自带的就那么几个,像我这样的懒人,就用那么几个就够了,extjs的图标选择起来都比较麻烦。如果实在不够用,就去extjs里面找几个加上。...再比如组件的使用,官方文档的描述也就那么几页,使用起来,也就那么几个方法与事件,但基本够用了。 个人不喜欢固步自封,喜好使用对自己来说有点神秘和陌生的技术。...在此之前,先说说编写本系列的计划吧: JQuery EasyUi之界面设计——前言与界面效果(一) JQuery EasyUi之界面设计——通用的JavaScript(二) JQuery EasyUi之界面设计...上面的按钮时类型,使用的是linkbutton实现的特效。下面区域使用的是datagrid,查询放在顶部工具栏。 弹出窗口 ?...弹出窗口可以用于新增|编辑,也可以用于其他功能,这个效果与extjs的window差不多。 新增与编辑 ? easyui的form自带验证、提交、重置与赋值,使用起来简单方便。 提示框 ? ? ?
–Ext是一个用javascript编写,与后台技术无关的前端ajax框架。因此,可以把Ext用在.Net、Java、Php等各种开发语言开发的应用中。...> javascript" src="extjs/ext-all.js"> javascript" language...复选框 { xtype: 'checkbox', fieldLabel: '请选择', name: 'bad_movie' } ? 下拉框 对于combobox我们也要为它添加配置。...菜单的所有itmes可以组合起来形成一些列可选择的按钮 xtype: 'tbsplit',分割菜单 就是按钮和菜单的结合。在使用它的时候只要在menu配置项目中添加按钮的属性就可以了。...点击按钮左边部分可以触发按钮本身的事件,点击按钮右边的部分(有个倒三角)可以展开菜单。
jquery获取尺寸的方法 width() 方法设置或返回元素的宽度(不包括内边距、边框或外边距)。 height() 方法设置或返回元素的高度(不包括内边距、边框或外边距)。...innerWidth() 方法返回元素的宽度(包括内边距)。 innerHeight() 方法返回元素的高度(包括内边距)。 outerWidth() 方法返回元素的宽度(包括内边距和边框)。...outerHeight() 方法返回元素的高度(包括内边距和边框)。 js获取尺寸的方法 clientWidth 是对象可见的宽度,不包滚动条等边线,会随窗口的显示大小改变。...offsetWidth 是对象的可见宽度,包滚动条等边线,会随窗口的显示大小改变。 Window 尺寸 有三种方法能够确定浏览器窗口的尺寸(浏览器的视口,不包括工具栏和滚动条)。...4.style.width仅能返回以style方式定义的内部样式表的width属性值。
jQuery 一.jQuery入门 1.javascript类库 JavaScript 库封装了很多预定义的对象和实用函数。能帮助使用者建立有高难度交互客户端页面, 并且兼容各大浏览器。...核心理念是write less,do more(写得更少,做得更多) 当前流行的 JavaScript 库有: jQuery 使用非常多了 EXTJS 功能比jQuery更多,但ext2.0收费 Prototype...Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷 2.jQuery介绍 jQuery是继prototype之后又一个优秀的Javascript...它是轻量级的js库 ,它兼容CSS3,还兼容各种浏览器。 jQuery已经成为最流行的javascript库,在世界前10000个访问最多的网站中,有超过55%在使用jQuery。...:submit 提交 :image 按钮,可以显示图片 :reset 重置 :button 按钮 或 :file 文件上传 :hidden
ExtJS是一个用 javascript编写,与后台技术无关的前端 ajax框架。因此,可以把 ExtJS用在.Net、Java、Php等各种开发语言开发的应用中。 ...JavaScript客户端技术的精品。.../ext/src/locale/ext-lang-zh_CN.js"type="text/javascript"> 在 ExtJS库文件及页面内容加载完后,ExtJS会执行 Ext.onReady...,至于extTree.ashx的内容,里面可以根据需要从数据库中提取并组成类似与extTree.ashx这个url返回的内容的json格式。...-2.6.min.js"type="text/javascript"> zTreeStyle.css为jquery zTree为样式文件库,jquery-1.4.2.
今天汇总整理了 JavaScript 和 jQuery 获取元素宽高和位置的方法,比较全面,方便自己和需要并搜到此文章的朋友们查看。...var div = document.getElementById("myDiv"); console.log(div.getBoundingClientRect()); JavaScript...) offsetParent :元素的偏移容器(父元素) offsetTop :元素的相对垂直偏移位置(上边界距离可视区域最上边的距离) 事迹宽高 scrollHeight :整个元素的高度(包括带滚动条的隐蔽的地方...) scrollWidth :元素的整个宽度(包括带滚动条的隐蔽的地方) 鼠标滚动距离 scrollLeft :是该元素的显示(可见)的内容上边与该元素实际的内容的距离(滚动条滚去的宽度) scrollTop...:是该元素的显示(可见)的内容与该元素实际的内容的距离(滚动条滚去的高度) jQuery中: ?
上周我们聊了一下jQuery的基础部分,这周我们把jQuery的高级部分学习一下吧!同时也预祝各位小伙伴新年快乐!...DOCTYPE html> 广告的自动显示与隐藏 ...--引入jquery--> javascript" src=".....,小相框的图片快速切换,点击“停止”按钮,小相框内的图片暂停,大相框展示小相框内的内容。..."> //使用jQuery插件 给jq对象添加2个方法 check()选中所有复选框,uncheck()取消选中所有复选框 //1.定义jQuery的对象插件
下面就Web开发用到的前端框架、UI套件、UI插件一一列举(排名不分先后): jQuery UI jQuery UI以 jQuery 为基础的开源 JavaScript 网页用户界面代码库。...jQuery UI 与 jquery 的主要区别是: (1) jQuery是一个js库,主要提供的功能是选择器,属性修改和事件绑定等等。...ExtJS ExtJS 是最流行的 JavaScript 框架之一,提供了非常丰富的 UI 组件,包括高性能的数据表格、图表、选项卡、弹窗、工具条和菜单等等整套的 Web UI 组件,可以帮助你构建用户体验良好的...ExtJs初期仅是对Yahoo! UI的对话框扩展,后来逐渐有了自己的特色,深受网友的喜爱。 发展至今, Ext除YUI外还支持Jquery、Prototype等的多种JS底层库,让大家自由地选择。...Bootstrap提供了优雅的HTML和CSS规范,由动态CSS语言LESS写成,与CSS 框架Blueprint存在很多相似之处。
console.log($("div").data("index")); }) 1.1.4 案例:购物车案例模块-全选 全选思路:里面3个小的复选框按钮...因为checked 是复选框的固有属性,此时我们需要利用prop()方法获取和设置该属性。 把全选按钮状态赋值给3小复选框就可以了。 当我们每次点击小的复选框按钮,就来判断。...如果小复选框被选中的个数等于3 就应该把全选按钮选上,否则全选按钮不选。 :checked 选择器 :checked 查找被选中的表单元素。 <!...清理购物车 商品后面的删除按钮: 一定是删除当前的商品,所以从 $(this) 出发 删除选中的商品: 先判断小的复选框按钮是否选中状态,如果是选中,则删除对应的商品 清理购物车: 则是把所有的商品全部删掉...(详情参考源代码) 1.3.5 案例:购物车案例模块-选中商品添加背景 核心思路:选中的商品添加背景,不选中移除背景即可 全选按钮点击:如果全选是选中的,则所有的商品添加背景,否则移除背景 小的复选框点击
前一阵发过一篇利用ExtJs的ScriptTagProxy实现Ajax跨域请求的文章(https://cloud.tencent.com/developer/article/1026528),这几天看了一下...Jquery,发现如果用JQuery中的getScript其实更简单(jquery 1.2.6版本) 这里给出代码,希望对Ajax跨域感到棘手的朋友有所帮助: Code JQuery学习 jquery-1.2.6.min.js" type="text/javascript"> <script type="text...: var jimmy = {name:"jimmy.yang",email:jimmy.yang@163.com} 感觉是不是比ExtJs的ScriptTagProxy还要简洁?...个人感觉Jquery简单明了,短小精干,ExtJs功能强大,组件丰富! 欢迎转载,但请保留来源:菩提树下的杨过
* jQuery是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架)。...最新版本:3.2.1(2017年3月20日) * jquery-xxx.js 与 jquery-xxx.min.js区别: 1. jquery-xxx.js...JQuery对象和JS对象区别与转换: 1.JQuery对象在操作时,更加方便; 2.JQuery对象和JS对象方法不通用; 3.两者相互转换: * JQuery --> JS : JQuery...='text']:disabled").val("bbb"); }); //jQuery 对象的 length 属性获取复选框选中的个数...//使用jquery插件 给jq对象添加2个方法 check()选中所有复选框,uncheck()取消选中所有复选框 //定义jquery对象插件: $.fn.extend
这一节,我们将看到ExtJs功能强大的可编辑网格控件,几乎与VS.Net的GridView功能一样了,但是ExtJs的可是纯JS的UI 一.静态示例(改自ExtJs的官方示例) a.因为我们是采用xml.../ext-all.js"> 可编辑的网格 javascript">...2007-03-07T15:48:04,ExtJs不能正确识别这种格式,无奈之下,只好手动修改*.designer.cs文件中自动生成的T_Class类,把...FormatDateString方法,当然大家也可以自己定义返回的格式,只要ExtJs能识别就可以了 2.前端页面,跟静态示例几乎一样,贴一下代码: 可编辑的网格 javascript">
jQuery是一个广泛使用的JavaScript库,用于简化HTML表单的处理和操作。在jQuery中,表单选择器是一种非常有用的选择器,用于选择表单元素并对其进行操作。...在jQuery中,表单选择器可以根据表单元素的类型、属性、状态等条件来选择元素。...例如,选择所有的复选框,可以使用如下的表单选择器:$(":checkbox")这将选中所有的复选框。:radio选择所有的单选框(type为radio)。...例如,选择所有的单选框,可以使用如下的表单选择器:$(":radio")这将选中所有的单选框。:submit选择所有的提交按钮(type为submit)。...例如,选择所有的提交按钮,可以使用如下的表单选择器:$(":submit")这将选中所有的提交按钮。
今天看到了 AngularJs 2.0 版本将基于 TypeScript 构建 的消息。与同事们对 TypeScript 展开了讨论。本文记录一些个人的想法。...一是因为我要做的是 SinglePageApplication 的 Web 界面框架,而 ExtJs 4 中带了大量的界面控件,非常方便使用;其次,ExtJs 4 提供了客户端的实体模型,这可以与 Rafy...我们不得不人为地添加了一个《Javascript 类库开发规范》。该文档中的内容其实还是约定了一些封装、继承、多态的编写约定(ExtJS 给出的面向对象类型系统同样不完美)、以及一些代码的规范。...例如一般性的 Web 应用或站点的前端开发,这种页面级的逻辑往往编写在页面中,即简单,也不需要 OOD;再如,JQuery 框架的开发,这种框架的目标是灵活、方便、动态,而不是面向对象,所以也不太适合,...所以 JQuery 框架应该不会使用 TypeScript 来重写。
false:如果当前function返回为true,则结束本次循环,继续下次循环(continue) $.each(object, [callback]),object为需要遍历的jq对象,回调方法中的参数与...for..of:jquery 3.0 版本之后提供的方式。.../js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"> javascript...javascript"> $(function () { //使用on给按钮绑定单击事件 click $("#btn.../javascript"> $(function () { //获取按钮,调用toggle方法 $("#btn")
jquery mobilejquery mobile的诞生jquery mobile的安装jquery mobile的使用 jquery mobile页面jquery mobile过渡jquery mobile...定位jquery mobile按钮 jquery mobile图标jquery mobile导航栏jquery mobile折叠jquery mobile列布局jquery mobile列表 jquery...mobile表单单选按钮复选框选择菜单范围滑块切换开关 jquery mobile主题jquery mobile实战jquery mobile事件 jquery mobile页面事件jquery mobile...预加载和懒加载技术预加载懒加载 javascript代码优化javascript代码可维护性代码与结构分离样式与结构的分离数据与代码分离 javascript代码可扩展性javascript代码可调试性...set与map声明操作方法遍历方法 箭头函数一个参数的箭头函数没有参数的箭头函数多个参数的箭头函数函数体箭头函数返回对象箭头函数事件handler数组排序回调 es6相对于es5宽展函数的扩展对象的扩展数组的扩展
jQuery框架安装及jQuery特点介绍,JQuery是一个便捷、简洁的JavaScript框架,封装了Js常用的功能代码,提供一种简便的Js设计模式,优化Html文档操作、事件处理、动画设计和Ajax...随着Web前端技术的不断发展,互联网上诞生了很多优秀的JavaScript框架,这些框架基本上都封装了JavaScript、DOM和Ajax等操作的功能为开发人员提供了更加快捷、强大的开发方式。...常见的JavaScript框架有jQuery、Prototype、ExtJS和等。...,与企业需求同步。好友都在里面学习交流,每天都会有大牛定时讲解前端技术!也可以关注我的微信公众号:【前端留学生】 每天更新最新技术文章干货。 目前的jQuery最新版本是v3.5.1。...jQuery使用非常简单,只要在HTML(或JSP)中引入一个外部JavaScript文件即可,其引入代码如下所示: image.png 上述代码表示引入当前目录下的“jquery-3.5.1.min.js