jQuery单击除div之外的任何位置 - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

JQuery高级应用

for..of：jquery 3.0 版本之后提供的方式。...}) ; //使用off解除btn按钮的单击事件 $("#btn2").click(function (...当单击jq对象对应的组件后，会执行fn1.第二次点击会执行fn2..... 注意：1.9版本 .toggle() 方法删除，jQuery Migrate（迁移）插件可以恢复此功能。...-- 整体的DIV --> div> 插件增强JQuery的功能如何定义插件：（看下面两个案例） $.fn.extend(object) 增强通过Jquery获取的对象的功能 $("#id") ?

7.7K3 0

WEB入门之十四 jQuery事件

当按下鼠标左键时记录鼠标位置作为起始位置；当鼠标移动时一直记录鼠标的当前位置；当松开鼠标左键时记录鼠标位置作为结束位置。...参数 e 是传递过来的事件对象，相当于 DOM 中的 event 对象， jQuery 对该对象进行了进一步封装， pageX 和 pageY 用了获取事件发生的位置， jQuery 事件对象会在下面进行详细介绍...div>div> 该示例与5.12差不多，只是由hover事件换成了toggle事件，当鼠标单击绿色的标题时，下面的内容就会显示出来；当鼠标再次单击绿色的标题时，下面的内容就会隐藏起来...把bind换成live后，表格中的任何一行在单击时都可以改变背景色，包括动态创建的行。...，因此页面一打开，在用户没有进行任何操作的情况下就会先后弹出两个对话框。

1.8K1 0

您找到你想要的搜索结果了吗？

是的

没有找到

WEB入门之十四 jQuery事件

当按下鼠标左键时记录鼠标位置作为起始位置；当鼠标移动时一直记录鼠标的当前位置；当松开鼠标左键时记录鼠标位置作为结束位置。...参数 e 是传递过来的事件对象，相当于 DOM 中的 event 对象， jQuery 对该对象进行了进一步封装， pageX 和 pageY 用了获取事件发生的位置， jQuery...div> div> 该示例与5.12差不多，只是由hover事件换成了toggle事件，当鼠标单击绿色的标题时，下面的内容就会显示出来；当鼠标再次单击绿色的标题时...把bind换成live后，表格中的任何一行在单击时都可以改变背景色，包括动态创建的行。...，因此页面一打开，在用户没有进行任何操作的情况下就会先后弹出两个对话框。

1.9K1 0

杨老师课堂之Jquery的筛选,事件,效果,Ajax,javascript跨域)

,这个元素的位置是从0算起。...事件冒泡可能会引起预料之外的效果,上例中,本来只想触发元素的click事件,然而元素和元素的click事件也同时被触发了.因此有必要对事件的作用范围进行限制.当单击元素时,只触发元素的click...事件对象: 由于IE-DOM和标准DOM实现事件对象的方法各不相同,导致在不同浏览器中获取事件对象变得比较困难.针对这个问题,jquery进行了必要的扩展和封装,从而使得在任何浏览器中能很好的轻松的访问获取事件对象以及事...; event.stopPropagation();//停止冒泡事件 }) 当单击span元素时,只会触发span元素上的click事件,而不会触发 div元素和body元素的click事件....可以用同样的方法解决元素上的问题阻止默认行为网页中的元素都有自己默认的行为,例如:单击超链接后悔跳转,单击”提交”按钮会表单会提交,有时需要阻止元素的默认行为在jquery中,提供了preventDefault

10.2K2 0

jQuery 入门指南教程

选择所有的div元素，除了前三个 $('div:animated') // 选择当前处于动画状态的div元素 dom对象和jQuery对象区别只有jQuery对象才能使用jQuery定义的方法。...// value 值 $('input').val(); // 返回表单输入框的value值 $('input').val('test'); // 将表单输入框的value值设为test // 单击事件...$('#msg').click(); // 触发 id 为 msg 的元素的单击事件 $('#msg').click(fn); // 为 id 为 msg 的元素的单击事件添加函数如果选中多个元素，...$.inArray() 返回一个值在数组中的索引位置。如果该值不在数组中，则返回-1。 $.grep() 返回数组中符合某种标准的元素。 $.extend() 将多个对象，合并到第一个对象。...$.isEmptyObject() 判断某个对象是否为空（不含有任何属性）。 $.isFunction() 判断某个参数是否为函数。

1.7K1 1

在 jQuery Mobile 中使用 UI 组件

为了使用本文中的任何示例，您必须下载或包括远程托管的 jQuery Mobile 框架文件，您可以在参考资料中找到相关的链接。...jQuery Mobile 框架包括一组标准移动图标，您可以通过 data-icon 属性使用它们，您也可以使用自己创建或购买的任何自定义图标。...对列表提供更多功能的一个选项称为拆分按钮列表。拆分按钮列表使您能够在同一个列表项中提供两个可单击的选项。...，用户可以单击它查看有关该项的更多详细信息。...要创建任何这些表单元素，您只需要将输入类型设置为其中一个这里所提及的值。如需了解 HTML5 输入类型的完整列表，请参阅参考资料。除了所支持的 HTML5 输入类型之外，您还可以创建一个滑块。

12K2 0

JQuery高级

jQuery中定义变量的时候，一般命名用$开头。同事一看就知道是使用了jQuery，然后使用jQuery的语法。其实$是jQuery中的一个函数。...比如子级有单击事件，那么父级如果有单击事件也会被触发，父级的父级如果有单击事件也会被触发。任何一个操作，计算机或者浏览器都会去处理。不管你有没有设置对应的事件。...class="father"> div class="son">1div> div> 3.事件委托把子级的事件委托给父级（父：最近的能包含住将来发生事件的所有子级...共计10个函数而已：控制顺序------移动节点-------- 下面的函数，如果没有节点，那么会新增对应的节点，如果有这个节点，那么就会移动相对应的节点。所以此处没有任何函数需要学习。...新增节点------- 步骤： 1、声明变量保存节点数据（名字一般为$开头，然后找的标签是什么就叫做什么） 2、使用追加函数将节点变量追加到指定位置子级加： append(添加的内容) 向末尾加 appendTo

2K5 0

jQuery 事件

div class="content"> jQuery是继Prototype之后又一个优秀的JavaScript库，它是一个由 John Resig 创建于2006...div> div> 移除事件 off() 方法通常用于移除通过 on() 方法添加的事件处理程序。...() event.namespace 返回当事件被触发时指定的命名空间 event.pageX 返回相对于文档左边缘的鼠标位置 event.pageY 返回相对于文档上边缘的鼠标位置 event.preventDefault...() 阻止其他事件处理程序被调用 event.stopPropagation() 阻止事件向上冒泡到 DOM 树，阻止任何父处理程序被事件通知 event.target 返回哪个 DOM 元素触发事件...常用jQuery事件的范例代码 <!

3.9K7 0

学习jQuery这一篇就够了

dom，调用 jQuery 对象的任何方法后返回的还是当前 jQuery 对象。...注意：如果存在（不存在）就删除（添加）一个样式类需求描述：当单击按钮的时候，隐藏 div，再次单击按钮的时候，显示 div .hide { width: 100px; height...主要的不同是语法，特别是插入内容和目标的位置。对于 .after ()，选择表达式在函数的前面，参数是将要插入的内容。...需求描述：为 ul 下的所有 li 添加单击事件，要求将该单击事件委托给 ul，当单击 li 时，所对应的 li 背景变为红色 1111 2222div 内移动，获取当前鼠标相对 div 的位置坐标 .outer { width: 200px; height: 200px; background: black

3.5K5 0

Jquery入门基础教程免费版

JQuery 一.JQuery基础语法 1.概念 JQuery是javaScript的一个库，Jquery基于javascript开发出来。目的就是为了简化javascript的开发。...————————————————-----------看大厂的源码------ jd:1.6.4 sina:1.7.3 jquery 3.选择器和方法 3.1 使用jquery访问三个div元素 <!...查找所有文件域: $(":file") 表单属性过滤器语法描述示例 :enabled 匹配所有可用元素 $(" #userform :enabled" )匹配form内部除编号输入框外的所有元素...Click事件 3.1 jQuery基础事件 3.1.1 鼠标事件方法描述执行时机 click( ) 触发或将函数绑定到指定元素的click事件单击鼠标时 mouseover( ) 触发或将函数绑定到指定元素的...分类：DOM操作分为三类： DOM Core：任何一种支持DOM的编程语言都可以使用它，如getElementById()，js。

2.2K1 0

WEB入门之十三 jQuery选择器

上一章我初步接触了jQuery，并能够编写一些简单的jQuery代码，其中重点是jQuery基本选择器。jQuery的选择器非常强大，它是jQuery的根基，基本上任何操作都要依赖于选择器。...核心技能部分 4.1 jQuery选择器 jQuery选择器的主要功能是查找、匹配并获取页面元素，这是进行任何操作的前提。jQuery提供了众多功能强大且使用方便的选择器，完全能满足开发需求。...表4-1-6 过滤选择器名称说明 :first 获得匹配到的第一个元素 :last 获得匹配到的最后一个元素 :not ( selector ) 获得除了匹配的元素之外的元素...")表示后代选择器；而没有空格的本章总结选择器是jQuery的核心，基本上任何业务及功能的实现都需要选择器。...A. jQuery选择器中不能包含任何特殊字符 B. jQuery选择器可以包含空格 C. jQuery选择器支持转义字符二、上机练习数据库中的数据查询出来后，在前台用表格进行显示。

1.5K1 0

WEB入门之十三 jQuery选择器

本章简介上一章我初步接触了jQuery，并能够编写一些简单的jQuery代码，其中重点是jQuery基本选择器。jQuery的选择器非常强大，它是jQuery的根基，基本上任何操作都要依赖于选择器。...核心技能部分 4.1 jQuery选择器 jQuery选择器的主要功能是查找、匹配并获取页面元素，这是进行任何操作的前提。jQuery提供了众多功能强大且使用方便的选择器，完全能满足开发需求。...表4-1-6 过滤选择器名称说明 :first 获得匹配到的第一个元素 :last 获得匹配到的最后一个元素 :not ( selector ) 获得除了匹配的元素之外的元素 :even 匹配所有索引值为偶数的元素...".test : hidden")表示后代选择器；而没有空格的本章总结选择器是jQuery的核心，基本上任何业务及功能的实现都需要选择器。...A. jQuery选择器中不能包含任何特殊字符 B. jQuery选择器可以包含空格 C. jQuery选择器支持转义字符二、上机练习数据库中的数据查询出来后，在前台用表格进行显示。

1.4K1 0

无障碍工具条本地化安装部署

步骤二：在标签前,引用v1.8以上的jquery.min.js(原网站已引用v1.8以上的jquery跳过此步骤)。...建议在header.htm类似的页头模板页面中引用jquery，以达到一处安装，全站皆有的效果。...--区域跳转功能定制外网路径,域名不要带www --> /canyou/js/site/域名.js 步骤五：在localhost:8080/首页位置添加链接，确保红色加粗的不变。...可以使用任何html标签。确保该链接放在页面的易发现位置。...title="网站信息无障碍工具条" href="javascript:;" class="wzayd" accesskey="g">无障碍阅读测试部署是否成功在浏览器中输入地址或通过单击原网站头部无障碍操作条中的链接即可完成对网站的信息无障碍化访问

2980 0

Web前端知识(四)

鼠标单击事件 click 鼠标进入事件 mouseover 鼠标离开事件 mouseout 鼠标移动事件 mousemove 4.1.6. jQuery操作CSS l通过jQuery可以很方便的来操作...width() width(value) height() height(value) 2.获取元素偏移 offset() 获取某个元素相对于视口的偏移位置 offset().left...; offset().top; position()获取某个元素相对于父元素的偏移位置 position().left position().top 4.1.7.2.操作HTML l使用jQuery...jQuery 选择器实现了 CSS1~CSS3 的大部分规则之外,还实现了一些自定义的选择器,用于各种特殊状态的选择。...p”) 选取div后代中所有p标签(包括孙子) $(“div>p”) 选取div直接后代中p标签(不包括孙子) $(“div+p”) 选取紧跟div后的兄弟元素中第一个p $(“div~p”) 选取紧跟后的兄弟元素中的所有

8.4K3 0

一文深入JQuery

(object, [callback]) for..of: jquery 3.0 版本之后提供的方式事件绑定 jquery标准的绑定方式 on绑定事件/off解除绑定事件切换：toggle 案例...表单对象.submit();//让表单提交 on绑定事件/off解除绑定 jq对象.on(“事件名称”,回调函数) jq对象.off(“事件名称”) 如果off方法不传递任何参数，则将组件上的所有事件全部解绑...事件切换：toggle jq对象.toggle(fn1,fn2…) 当单击jq对象对应的组件后，会执行fn1.第二次点击会执行fn2… 注意：1.9版本 .toggle() 方法删除,jQuery...-- 整体的DIV --> div> 的功能实现方式： $.fn.extend(object) 增强通过Jquery获取的对象的功能 $(“#id”) $.extend(object) 增强JQeury对象自身的功能 $/jQuery

4.8K3 0

Jump Start Bootstrap 第4章

该插件在任何DOM元素中侦听滚动，并根据元素的滚动位置在导航栏中突出显示菜单项。基本上，它是一个双组件的插件;它由一个导航条和一个内容区域组成。内容区域划分为多个部分，每个部分都有一个惟一的ID。...与普通面板的panel-body没有包装在任何div中不同，在这里被div包裹是强制性的，以达到折叠的效果。...添加data-dismiss使按钮在单击时关闭模式对话框。对于本体，我们需要一个包含类modal-body的div>元素。您可以将几乎任何内容放到该元素中。...它可以放在文档的任何位置。 Modals有三个宽度:大的，默认的，小的。这些对于在模式对话框中适当地填充内容非常有帮助。如果没有为modal-dialog元素提供额外的类，它的默认宽度是600px。...show属性用于通过JavaScript切换模式的可见性。当设置为true时，模式对话框将自动显示，不需要单击任何句柄元素。

34.9K4 0

JQuery 笔记（二）

) * 当单击jq对象对应的组件后，会执行fn1.第二次点击会执行fn2........分析发现JQuery的显示和隐藏动画效果其实就是控制display 3....给开始按钮绑定单击事件 1.1 定义循环定时器 1.2 切换小相框的src属性...插件：增强JQuery的功能 1....* 增强JQeury对象自身的功能 $/jQuery

4.1K1 0

jQuery设计思想

五、元素的操作：移动 jQuery设计思想之五，就是提供两组方法，来操作元素在网页中的位置移动。一组方法是直接移动该元素，另一组方法是移动其他元素，使得目标元素达到我们想要的位置。...除了元素的位置移动之外，jQuery还提供其他几种操作元素的重要方法。...$.inArray() 返回一个值在数组中的索引位置。如果该值不在数组中，则返回-1。 $.grep() 返回数组中符合某种标准的元素。...$.isEmptyObject() 判断某个对象是否为空（不含有任何属性）。 $.isFunction() 判断某个参数是否为函数。....change() 表单元素的值发生变化 .click() 鼠标单击 .dblclick() 鼠标双击 .focus() 表单元素获得焦点 .focusin() 子元素获得焦点 .focusout

2.7K6 0

waypoint_使用jQuery Waypoint创建粘性导航标题

我们不需要任何项目符号，因此我们也将使用list-style: none 。...但是我们无法做到这一点，因此我们需要在nav的末尾添加两个非语义div 。...所有这些都是标准的jQuery票价：在nav添加或删除sticky类后，我们便会使用.css()覆盖元素的垂直位置，然后使用.animate()其设置为应有的水平。...如果您不仅仅想添加和删除类，还可以考虑使用LavaLamp这样的插件。在某些时候，您可能已经注意到，单击导航栏中的链接会将部分的顶部置于浏览器视口的顶部。...由于z-index的工作原理，除了首先要避免它之外，似乎没有简单的方法可以解决此冲突。

5.4K3 0

前端基础-JQuery (二)

表单对象.submit();//让表单提交 2. on绑定事件/off解除绑定 * jq对象.on("事件名称",回调函数) * jq对象.off("事件名称") * 如果off方法不传递任何参数...) * 当单击jq对象对应的组件后，会执行fn1.第二次点击会执行fn2........分析发现JQuery的显示和隐藏动画效果其实就是控制display 3....-- 整体的DIV --> div> JQuery的功能 1.

3.3K1 0

点击加载更多

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭