jQuery 表单事件与遍历详情

jQuery 表单事件与遍历详情

目录

表单事件

.blur()

.focus()

.change()

.submit()

遍历

.map()

.each()

.get()

表单事件 .blur()

为 "blur" 事件绑定一个处理函数,或者触发元素上的 "blur" 事件(注:此事件不支持冒泡)。

$('#other').click(function() { $('#target').blur(); }); .focus()

为 JavaScript 的 "focus" 事件绑定一个处理函数,或者触发元素上的 "focus" 事件。

$('#target').focus(function() { alert('Handler for .focus() called.'); }); .change()

为JavaScript 的 "change" 事件绑定一个处理函数,或者触发元素上的 "change" 事件。

$('.target').change(function() { alert('Handler for .change() called.'); }); .submit()

当用户试图提交表单时,就会在这个表单元素上触发submit事件。它只能绑定在<form>元素上。

$('#target').submit(function() { alert('Handler for .submit() called.'); }); 遍历 .map()

通过一个函数匹配当前集合中的每个元素,产生一个包含新的jQuery对象。

由于返回值是一个jQuery包裹的数组,所以通常会使用get()方法将其转换成普通的数组。

<!DOCTYPE html> <html lang="en" dir="ltr"> <head> <meta charset="utf-8"> <title></title> <script src="./jquery-3.6.0.min.js" charset="utf-8"></script> </head> <body> <form method="post" action=""> <fieldset> <div> <label for="two">2</label> <input type="checkbox" value="2" id="two" name="number[]"> </div> <div> <label for="four">4</label> <input type="checkbox" value="4" id="four" name="number[]"> </div> <div> <label for="six">6</label> <input type="checkbox" value="6" id="six" name="number[]"> </div> <div> <label for="eight">8</label> <input type="checkbox" value="8" id="eight" name="number[]"> </div> </fieldset> </form> <script type="text/javascript"> $('input').map(function(index) { console.log(this.id); }) </script> </body> </html>

map()方法会返回一个新的数组。

.each()

遍历一个jQuery对象,为每个匹配元素执行一个函数。

<ul> <li>foo</li> <li>bar</li> </ul> $( "li" ).each(function( index ) { console.log( index + ":" + $(this).text()); });

each()返回的是原来的数组,并不会新创建一个数组。

.get()

通过jQuery对象获取一个对应的DOM元素。

<ul> <li id="foo">foo</li> <li id="bar">bar</li> </ul> console.log( $( "li" ).get( 0 ) );

到此这篇关于jQuery 表单事件与遍历详情的文章就介绍到这了,更多相关jQuery 表单事件内容请搜索易知道(ezd.cc)以前的文章或继续浏览下面的相关文章希望大家以后多多支持易知道(ezd.cc)!

推荐阅读

    确定java按钮响应事件的代码

    确定java按钮响应事件的代码,,* 阅读本文可以结合最后在java登录窗口界面下面是一个链接。 是定义的容器。 容器(CP =得到内容面板); / /

    90后瓶门事件图片

    90后瓶门事件图片,,现在孩子们还太早,有些女孩子总是在门口等一会儿,最近发生了一次酒瓶门事件。 近日,山东一家寄宿学校的一名女生带着一瓶

    为什么WPS表单总是不打开

    为什么WPS表单总是不打开,,为什么WPS表格总是打不开??百度知道为您找到了6条优质回答span>a,type:cluster">很有可能文件已经损坏。恢复

    laravel-admin|自定义表单与验证

    laravel-admin|自定义表单与验证,表单,场景,场景:很多时候,由于我们业务场景比较特殊,需要自定义表单,然后框架给我提供了对应表单组建!案列:以

    唐山打人事件视频源自哪里

    唐山打人事件视频源自哪里,华为,视频,唐山打人事件视频源自哪里唐山打人事件视频来源于哪里?为什么这个网友人敢于发出这个视频?不怕被威胁

    Win7系统怎么打开事件查看器?

    Win7系统怎么打开事件查看器?,查看器,事件, win7系统中有一个事件查看器,事件查看器是重要的系统管理软件,通过它可以了解到某项功能配置、

    苹果7爆炸事件真的吗|iphone爆炸事件

    苹果7爆炸事件真的吗|iphone爆炸事件,,苹果7爆炸事件真的吗两个标志性建筑 。“9·11事件”指的是美国东部时间2001年9月11日上午(北京时间

    VB里的mousemove事件举例

    VB里的mousemove事件举例,鼠标,事件,本文目录VB里的mousemove事件举例C# 怎么在mousemove事件中判断鼠标是否运动能够在窗体上触发MouseMo

    js默认事件汇总

    js默认事件汇总,事件,表单,默认事件   就是浏览器通过HTML标签或DOM元素提供的一些功能性的默认行为。比如在a标签href属性上的跳转,右键