javascript jquery对form元素的常见操作详解


Posted in Javascript onJune 12, 2016

1.下拉框 select :

移除option

$("#ID option").each(function(){
 if($(this).val() == 111){
 
$(this).remove();
 }
});

添加option

$("<option value='111'>UPS Ground</option>").appendTo($("#ID"));

取得下拉选单的选取值

//取下拉?中的文本
$('#testSelect option:selected').text();
$("#testSelect").find('option:selected').text();
document.all.objSelect.options[document.all.objSelect.selectedIndex].text; //js操作 objSelect??elect的name//取得下拉?中值
$("#testSelect").val();
//js操作
document.getElementById('objSelect').value=2;
document.all.objSelect.value;

根据option的值选中下拉框

$('#testSelect').val('111');document.all.objSelect.value = objItemValue; //js操作 objSelect??elect的name或者iddocument.getElementById('sel').value=objItemValue;

select下拉框的第二个元素为当前选中值

$('#select_id')[0].selectedIndex = 1;

2,单选框 radio :

$("input[type=radio][checked]").val(); //得到单选框的选中项的值(注意中间没有空格)
$(':radio[name="radio"]:checked').val();//第二种方法

$("input[type=radio][value=2]").attr("checked",'checked'); //设置单选框value=2的为选中状态.(注意中间没有空格)
$(':radio[value="2"]').attr('checked','checked');

radio单选组的第二个元素为当前选中值

$("input[name='items']").get(1).checked = true;

3,复选框 checkbox :(其它写法参见上面:radio)

$("input[type='checkbox'][checked]").val(); //得到复选框的选中的第一项的值
$("#chk1").attr("checked",'');//不打勾
$("#chk2").attr("checked",true);// 打勾
//全?/不?

 $("#selectAll").bind('click',function(){
   var sa = $(this).attr("checked");
   $("input[name='sel[]']").each(function(){
     this.checked=sa;
   });
 });

4,?入框 input :

$(':input[name="keyword"]').val();//根据name值取得值

5,文本框 textarea :

固定文本框大小:
<textarea name="123" style="resize:none;"></textarea>

以上这篇javascript jquery对form元素的常见操作详解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript中继承用法实例分析
May 16 Javascript
jQuery过滤选择器用法示例
Sep 12 Javascript
JSON与JS对象的区别与对比
Mar 01 Javascript
基于vue v-for 循环复选框-默认勾选第一个的实现方法
Mar 03 Javascript
vue数据传递--我有特殊的实现技巧
Mar 20 Javascript
vue.js打包之后可能会遇到的坑!
Jun 03 Javascript
vue-router中scrollBehavior的巧妙用法
Jul 09 Javascript
详解如何在微信小程序中愉快地使用sass
Jul 30 Javascript
JavaScript惰性求值的一种实现方法示例
Jan 11 Javascript
vue 中Virtual Dom被创建的方法
Apr 15 Javascript
vue动画—通过钩子函数实现半场动画操作
Aug 09 Javascript
8个非常实用的Vue自定义指令
Dec 15 Vue.js
js实现当鼠标移到表格上时显示这一格全部内容的代码
Jun 12 #Javascript
浅谈JS中逗号运算符的用法
Jun 12 #Javascript
Node.js Addons翻译(C/C++扩展)
Jun 12 #Javascript
基于JS代码实现当鼠标悬停表格上显示这一格的全部内容
Jun 12 #Javascript
jQuery的each循环用法简单示例
Jun 12 #Javascript
基于jquery插件编写countdown计时器
Jun 12 #Javascript
跨域请求的完美解决方法(JSONP, CORS)
Jun 12 #Javascript
You might like
PHP页面跳转实现延时跳转的方法
2016/12/10 PHP
Thinkphp框架中D方法与M方法的区别
2016/12/23 PHP
PHP 返回数组后处理方法(开户成功后弹窗提示)
2017/07/03 PHP
Docker搭建自己的PHP开发环境
2018/02/24 PHP
javascript document.referrer 用法
2009/04/30 Javascript
JS 面向对象的5钟写法
2009/07/31 Javascript
关于include标签导致js路径找不到的问题分析及解决
2013/07/09 Javascript
PHP 数组current和next用法分享
2015/03/05 Javascript
自定义jQuery插件方式实现强制对象重绘的方法
2015/03/23 Javascript
MVC Ajax Helper或Jquery异步加载部分视图
2015/11/29 Javascript
全面理解JavaScript中的继承(必看)
2016/06/16 Javascript
DOM中事件处理概览与原理的全面解析
2016/08/16 Javascript
完美解决js传递参数中加号和&amp;号自动改变的方法
2016/10/11 Javascript
jQuery实现Table表格隔行变色及高亮显示当前选择行效果示例
2017/02/14 Javascript
nodejs图片处理工具gm用法小结
2018/12/12 NodeJs
微信小程序全局变量GLOBALDATA的定义和调用过程解析
2019/09/23 Javascript
nodejs nedb 封装库与使用方法示例
2020/02/06 NodeJs
[38:51]2014 DOTA2国际邀请赛中国区预选赛 Orenda VS LGD-CDEC
2014/05/22 DOTA
python 中的列表解析和生成表达式
2011/03/10 Python
python实现类似ftp传输文件的网络程序示例
2014/04/08 Python
在Python的web框架中中编写日志列表的教程
2015/04/30 Python
python使用matplotlib绘图时图例显示问题的解决
2017/04/27 Python
tensorflow实现softma识别MNIST
2018/03/12 Python
Python3.6通过自带的urllib通过get或post方法请求url的实例
2018/05/10 Python
PyQt5 QListWidget选择多项并返回的实例
2019/06/17 Python
django echarts饼图数据动态加载的实例
2019/08/12 Python
Myprotein加拿大官网:欧洲第一的运动营养品牌
2018/01/06 全球购物
司机岗位职责
2013/11/15 职场文书
马云的职业生涯规划之路
2014/01/01 职场文书
应聘文员自荐信范文
2014/03/11 职场文书
军人离婚协议书样本
2014/10/21 职场文书
测量员岗位职责
2015/02/14 职场文书
酒店温馨提示语
2015/07/14 职场文书
初中语文教师研修日志
2015/11/13 职场文书
重温经典:乔布斯在斯坦福大学的毕业演讲(双语)
2019/08/26 职场文书
利用python Pandas实现批量拆分Excel与合并Excel
2021/05/23 Python