实用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 相关文章推荐
slice函数的用法 之不错的应用
Dec 29 Javascript
jQuery Select(单选) 模拟插件 V1.3.62 改进版
Jul 17 Javascript
对javascript的一点点认识总结《javascript高级程序设计》读书笔记
Nov 30 Javascript
javacript使用break内层跳出外层循环分析
Jan 12 Javascript
详解JavaScript的流程控制语句
Nov 30 Javascript
jQuery绑定事件-多种实现方式总结
May 09 Javascript
Javascript this 函数深入详解
Dec 13 Javascript
学习使用Bootstrap栅格系统
May 11 Javascript
JS逻辑运算符短路操作实例分析
Jul 09 Javascript
JavaScript类数组对象转换为数组对象的方法实例分析
Jul 24 Javascript
原生js实现Flappy Bird小游戏
Dec 24 Javascript
JavaScript 生成唯一ID的几种方式
Feb 19 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
玩家交还《星际争霸》原始码光盘 暴雪报以厚礼
2017/05/05 星际争霸
PHP生成便于打印的网页
2006/10/09 PHP
yii2高级应用之自定义组件实现全局使用图片上传功能的方法
2016/10/08 PHP
php实例化一个类的具体方法
2019/09/19 PHP
redis+php实现微博(二)发布与关注功能详解
2019/09/23 PHP
jquery实现奇偶行赋值不同css值
2012/02/17 Javascript
用Jquery.load载入页面实现局部刷新
2014/01/22 Javascript
JavaScript设计模式之工厂方法模式介绍
2014/12/28 Javascript
分享javascript实现的冒泡排序代码并优化
2016/06/05 Javascript
jQuery内存泄露解决办法
2016/12/13 Javascript
vue组件实例解析
2017/01/10 Javascript
关于Bootstrap按钮组件消除黄框的方法
2017/05/19 Javascript
jQuery实现表格冻结顶栏效果
2017/08/20 jQuery
vue-cli + sass 的正确打开方式图文详解
2017/10/27 Javascript
Vue组件全局注册实现警告框的实例详解
2018/06/11 Javascript
vue中使用echarts制作圆环图的实例代码
2018/07/27 Javascript
jquery ajax加载数据前台渲染方式 不用for遍历的方法
2018/08/09 jQuery
vue里如何主动销毁keep-alive缓存的组件
2019/03/21 Javascript
了解JavaScript表单操作和表单域
2019/05/27 Javascript
浅析js实现网页截图的两种方式
2019/11/01 Javascript
Nodejs使用archiver-zip-encrypted库加密压缩文件时报错(解决方案)
2019/11/18 NodeJs
python通过openpyxl生成Excel文件的方法
2015/05/12 Python
Python中if __name__ == '__main__'作用解析
2015/06/29 Python
Flask的图形化管理界面搭建框架Flask-Admin的使用教程
2016/06/13 Python
解决Tensorflow2.0 tf.keras.Model.load_weights() 报错处理问题
2020/06/12 Python
Python偏函数实现原理及应用
2020/11/20 Python
python中os.remove()用法及注意事项
2021/01/31 Python
用HTML5 Canvas API中的clearRect()方法实现橡皮擦功能
2016/03/15 HTML / CSS
Canvas 文本转粒子效果的实现代码
2019/02/14 HTML / CSS
HTML块级标签汇总(小篇)
2016/07/13 HTML / CSS
世界上最大的巴士旅游观光公司:Big Bus Tours
2016/10/20 全球购物
简短证婚人证婚词
2014/01/09 职场文书
校长师德表现自我评价
2015/03/04 职场文书
用javascript制作qq注册动态页面
2021/04/14 Javascript
Python实现数据的序列化操作详解
2022/07/07 Python
ssh服务器拒绝了密码 请再试一次已解决(亲测有效)
2022/08/14 Servers