实用jquery操作表单元素的简单代码


Posted in Javascript onJuly 04, 2016

取下拉菜单选中项的文本; 获取和设置下拉菜单的值; 清空下拉菜单; 给下列菜单添加元素; 取单选框值; 单选或复选按钮的选择; 取复选框值; 判断单选或复选框是否被选中; 元素可用不可用; 判断元素可用不可用。

实用jquery操作表单元素代码

/*

假设在一个表单中有一个按钮id="save"
$(document).ready(function(){
   $("#save").click(function(){
    $("#save").attr("disabled",true);//设为不可用             
    $("#form1")[0].submit();//如果你有很多个id为form1的表单也没关系,只有第一个会提交的哈哈.
   });
});

取下拉菜单选中项的文本;

获取和设置下拉菜单的值;

清空下拉菜单;

给下列菜单添加元素;

取单选框值;

单选或复选按钮的选择;

取复选框值;

判断单选或复选框是否被选中;

元素可用不可用;

判断元素可用不可用。

1. 取下拉菜单选中项的文本

$("#select option[selected]").text();//select和option之间有空格,option为select的子元素  
$("#select option:selected").text();//如果写成$("#select").text();会把所有下拉菜单的文本选择出来

2.获取和设置下拉菜单的值

$("#select").val();//取值  
$("#select").val("value");//设置,如果select中有值为value的选项,该选项就会被选中,如果不存在,则select不做任何变动

3.清空下拉菜单

$("#select").empty();  
$("#select").html("");

4.给下列菜单添加元素

$('<option value="1">1</option>').appendto($("#select"));  
$("#select").append('<option value="1">1</option>');

5.取单选框值

$("#id[checked]").val();

6.单选或复选按钮的选择

$("#id[value=val]").attr("checked",true);//选择  
$("#id[value=val]").attr("checked","");//取消选择  
$("#id[value=val]").attr("checked",false);//取消选择  
$("#id[value=val]").removeattr("checked");//取消选择

7.取复选框值

$("input[type=checkbox][checked]").each(function(){  
alert($(this).val());  
})  

//如果用$("input[type=checkbox][checked]").val(),只会返回第一个被选中的值

8.判断单选或复选框是否被选中

if($("#id").attr("checked")){}//判断选中  
if($("#id").attr("checked")==true){}//判断选中  
if($("#id").attr("checked")==undefined){}//判断未选中

9.元素可用不可用

$("#id").attr("disabled",false);//设为可用  
$("#id").attr("disabled",true);//设为不可用

10.判断元素可用不可用

if($("#id").attr("disabled")){}//判断不可用  
if($("#id").attr("disabled")==undefined){}//判断可用

以上这篇实用jquery操作表单元素的简单代码就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
top.location.href 没有权限 解决方法
Aug 05 Javascript
javascript 中that的含义示例介绍
May 14 Javascript
JavaScript中原型和原型链详解
Feb 11 Javascript
JavaScript中的Math.atan2()方法使用详解
Jun 15 Javascript
JS中sort函数排序用法实例分析
Jun 16 Javascript
js接收并转化Java中的数组对象的方法
Aug 11 Javascript
JS/jQuery判断DOM节点是否存在的简单方法
Nov 24 Javascript
JS正则表达式修饰符global(/g)用法分析
Dec 27 Javascript
AngularJS 文件上传控件 ng-file-upload详解
Jan 13 Javascript
js时间戳与日期格式之间转换详解
Dec 11 Javascript
10分钟上手vue-cli 3.0 入门介绍
Apr 04 Javascript
在Vue项目中使用jsencrypt.js对数据进行加密传输的方法
Apr 17 Javascript
jQuery实现左侧导航模块的显示与隐藏效果
Jul 04 #Javascript
将List对象列表转换成JSON格式的类实现方法
Jul 04 #Javascript
jQuery解析与处理服务器端返回xml格式数据的方法详解
Jul 04 #Javascript
jQuery ajaxSubmit 实现ajax提交表单局部刷新
Jul 04 #Javascript
jQuery通用的全局遍历方法$.each()用法实例
Jul 04 #Javascript
JS构造函数与原型prototype的区别介绍
Jul 04 #Javascript
js中使用使用原型(prototype)定义方法的好处详解
Jul 04 #Javascript
You might like
加强版phplib的DB类
2008/03/31 PHP
php生成shtml类用法实例
2014/12/09 PHP
prototype与jquery下Ajax实现的差别
2009/09/13 Javascript
CSS+Jquery实现页面圆角框方法大全
2009/12/24 Javascript
基于JQuery的浮动DIV显示提示信息并自动隐藏
2011/02/11 Javascript
深入理解javascript中defer的作用
2013/12/11 Javascript
Javascript中的Array数组对象详谈
2014/03/03 Javascript
在JavaScript中重写jQuery对象的方法实例教程
2014/08/25 Javascript
jQuery内容过滤选择器用法分析
2015/02/10 Javascript
jQuery实现Tab选项卡切换效果简单演示
2015/11/23 Javascript
分享15个大家都熟知的jquery小技巧
2015/12/02 Javascript
JS通过Cookie判断页面是否为首次打开
2016/02/05 Javascript
jquery 将当前时间转换成yyyymmdd格式的实现方法
2016/06/01 Javascript
基于NodeJS+MongoDB+AngularJS+Bootstrap开发书店案例分析
2017/01/12 NodeJs
JavaScript中创建对象的7种模式详解
2017/02/21 Javascript
关于vue.js过渡css类名的理解(推荐)
2017/04/10 Javascript
JavaScript中如何判断一个值的类型
2017/09/15 Javascript
JS手机端touch事件计算滑动距离的方法示例
2017/10/26 Javascript
如何将你的AngularJS1.x应用迁移至React的方法
2018/02/01 Javascript
解决angular2在双向数据绑定时[(ngModel)]无法使用的问题
2018/09/13 Javascript
vue中多路由表头吸顶实现的几种布局方式
2019/04/12 Javascript
element-ui 文件上传修改文件名的方法示例
2019/11/05 Javascript
python使用xmlrpc实例讲解
2013/12/17 Python
使用python和Django完成博客数据库的迁移方法
2018/01/05 Python
Pycharm和Idea支持的vim插件的方法
2020/02/21 Python
Python爬虫+Tkinter制作一个翻译软件的示例
2021/02/20 Python
html5 移动端视频video的android兼容(去除播放控件、全屏)
2020/03/26 HTML / CSS
中国排名第一的外贸销售网站:LightInTheBox.com(兰亭集势)
2016/10/28 全球购物
英国皇室御用百货:福南梅森(Fortnum & Mason)
2017/12/03 全球购物
SCHIESSER荷兰官方网站:德国内衣专家
2020/10/09 全球购物
故意伤害人身损害赔偿协议书
2014/11/19 职场文书
2014年高三班主任工作总结
2014/12/05 职场文书
优秀乡村医生事迹材料(2016精选版)
2016/02/29 职场文书
JavaScript嵌入百度地图API的最详细方法
2021/04/16 Javascript
Java实现学生管理系统(IO版)
2022/02/24 Java/Android
PC版《死亡搁浅导剪版》现已发售 展开全新的探险
2022/04/03 其他游戏