jQuery 事件——关于select选中
场景:
eg:在管理一篇博文时,因博文的管理有一列叫:状态的列,该列有诸多状态,如:正常,待审核,删除等... 此时,若使用Select下拉列表进行状态选择,并在选中具体项值后,通过Ajax异步提交,在效果及体验上就能得到更大化的体验。
下拉列表例子如下:
<select id="status">
<option value="0" >待审核</option>
<option value="1" >未通过审核</option>
<option value="2" >制作中</option>
<option value="3">制作完成</option>
<option value="4" >发布</option>
<option value="5">暂停</option>
<option value="6">删除</option>
</select>
错误示范:
$("select#status").click(function(){
console.log($(this).val());
});
若通过click事件执行,则在点击下拉列表的首次便会触发一次Ajax请求,这样并不符合逻辑,故不能使用click事件作为下拉列表选中具体值的做法。
正确示范:
$("select#status").change(function(){
console.log($(this).val());
});
W3SCHOOL 对change事件的诠释如下:
定义和用法
当元素的值发生改变时,会发生 change 事件。
该事件仅适用于文本域(text field),以及 textarea 和 select 元素。
change() 函数触发 change 事件,或规定当发生 change 事件时运行的函数。
注释:当用于 select 元素时,change 事件会在选择某个选项时发生。当用于 text field 或 text area 时,该事件会在元素失去焦点时发生。
通过以上,能清楚明白,当对于Select下拉列表时,应该使用Change事件。
补充:
因为页面翻页也是使用Ajax技术进行异步处理,当翻页后,原写法将失效,此时应该使用如下代码进行执行:
$(document).on("change",'select#status',function(){
console.log($(this).val());
});
jQuery 事件——关于select选中的更多相关文章
- jquery事件之select选中事件
根据select下拉列表选中的不同选项执行不同的方法,工作中经常会用到,这里就要用到Jquery的select选中事件 这里给select加一个叫label_id的id,然后通过id选择器找到这个节点 ...
- Jquery怎么获取select选中项 自定义属性的值
Jquery如何获取select选中项 自定义属性的值?HTML code <select id="ddl" onchange="ddl_change(this)& ...
- jQuery如何获得select选中的值?input单选radio选中的值
jQuery取得select选中的值 本来以为jQuery("#select1").val();是取得选中的值, 那么jQuery("#select1").te ...
- jquery 如何获取select 选中项的下一个选项的值
<select> <option value="1" selected="selected">a</option> < ...
- Jquery 获取 radio/select选中值
Radio <input type="radio" name="rd" id="rd1" checked="checked& ...
- jQuery之获取select选中的值
本来以为jQuery("#select1").val();是取得选中的值, 那么jQuery("#select1").text();就是取得的文本. 这是不正确 ...
- JQuery 如何获取select选中的值
一.html代码 <select id="ddl"> <option value="100" emoney="12" &g ...
- 【jquery】jquery 在 ie6 下无法设置 select 选中的解决方法
本文主要解决在 ie6 下,jquery 无法设置 select 选中的问题.我们先看个例子: <!DOCTYPE HTML> <html lang="en-US" ...
- jquery设置select选中的文本
<select id="prov"> <option value="1">北京市</option> <option ...
随机推荐
- ArcGIS制图表达Representation实战篇3-控制点
ArcGIS制图表达Representation实战篇3-控制点 by 李远祥 这一章讲述的是一个非常专业的名词,叫控制点.此控制点非测绘行业术语的控制点,而是制图表达里面的控制点,所以不能混为一谈. ...
- Robot Framework和Selenium 2 Grid集成指南
1. 环境搭建 A. 所需软件 1. Selenium2Lib 1.0.1 这个特性需要用到Selenium2Lib的最新版本1.0.1,但是这个版本还有一些iframe支持和IE支持的问题需要修改, ...
- .net学习网站汇总
http://chs.gotdotnet.com/quickstart/简介:本站点是微软.NET技术的快速入门网站,我们不必再安装.NET Framework中的快速入门示例程序,直接在网上查看此示 ...
- iptables 完成联网控制 (续) ,独立native进程监听。
上一篇:http://www.cnblogs.com/oscar1011/p/5243877.html 之前做的iptables 来进行的联网控制,一直耿耿于怀,想要知道系统里的netd等等是如何做到 ...
- Raspberry树莓派学习笔记1—基本介绍
树莓派的简单介绍 一个名片大小的迷你个人电脑主机,还有wifi/蓝牙... 运行完整的Linux操作系统(注意关键字:完整,不是精简过的嵌入式Linux) 开源的硬件平台.与普通主机不同的是,它带有简 ...
- C#属性和字段
属性 属性是一种用于访问对象或类的特性的成员.属性是字段的自然扩展,这两者都是具有关联类型的命名成员.而且访问字段和属性的语法是相同的.然而,与字段不同,属性不表示存储位置.相反属性具有访问器,这些访 ...
- 前端福利:使用Wallpaper Engine让自己的桌面炫酷起来
Wallpaper Engine,是一款Steam上的特别特别炫酷的壁纸定制软件.它可以对你的桌面进行定制,可以使用视频,动画,网页等形式来替换壁纸. 注意到没,关键是可以使用Html格式的文件作为桌 ...
- 关于c# 基础运算符的应用
运算符 分为5种 1 算数预算符 +,-,*,/,分别为加减乘除 ++为加1,--为减1, 前++ 后++ 的区别 int a = 10, b = a++; Console ...
- USTC 1119 graph 图的同构
USTC 1119 图的同构的严格定义可以参考离散数学:The simple graphs G1=(V1,E1) and G2=(V2,E2)are isomorphic if there exist ...
- 从零开始搭建Salt Web之封装salt-api接口
salt-api现在已经正常运行,接下来则是实现通过调用salt-api来执行salt命令. 调用salt-api执行命令时,记得携带c_path参数 因为salt中自带了tornado这个库,所以决 ...