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 相关文章推荐
浏览器加载、渲染和解析过程黑箱简析
Nov 29 Javascript
使用jQuery判断IE浏览器版本的代码
Jun 14 Javascript
JavaScript编程中容易出BUG的几点小知识
Jan 31 Javascript
jQuery遍历json中多个map的方法
Feb 12 Javascript
Google 地图叠加层实例讲解
Aug 06 Javascript
JS弹性运动实现方法分析
Dec 15 Javascript
浅谈node的事件机制
Oct 09 Javascript
Vue.set() this.$set()引发的视图更新思考及注意事项
Aug 30 Javascript
VUE路由动态加载实例代码讲解
Aug 26 Javascript
javascript设计模式 ? 抽象工厂模式原理与应用实例分析
Apr 09 Javascript
es6函数之箭头函数用法实例详解
Apr 25 Javascript
JS实现密码框效果
Sep 10 Javascript
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
后宫无数却洁身自好的男主,唐三只爱小舞
2020/03/02 国漫
日本收入最高的漫画家:海贼王作者版税年收入高达8.45亿元
2020/03/04 日漫
php中的ini配置原理详解
2014/10/14 PHP
对于Laravel 5.5核心架构的深入理解
2018/02/22 PHP
javascript fullscreen全屏实现代码
2009/04/09 Javascript
js Event对象的5种坐标
2011/09/12 Javascript
js实现省市联动效果的简单实例
2014/02/10 Javascript
table行随鼠标移动变色示例
2014/05/07 Javascript
JavaScript运行机制之事件循环(Event Loop)详解
2014/10/10 Javascript
JavaScript中的anchor()方法使用详解
2015/06/08 Javascript
javascript顺序加载图片的方法
2015/07/18 Javascript
javascript中的五种基本数据类型
2015/08/26 Javascript
Jquery基础之事件操作详解
2016/06/14 Javascript
jQuery简单实现tab选项卡切换效果
2016/06/20 Javascript
JavaScript中return用法示例
2016/11/29 Javascript
详解基于javascript实现的苹果系统底部菜单
2016/12/02 Javascript
jQuery实现滚动条滚动到子元素位置(方便定位)
2017/01/08 Javascript
JavaScript事件委托原理与用法实例分析
2018/06/07 Javascript
JS中通过url动态获取图片大小的方法小结(两种方法)
2018/10/31 Javascript
JS使用正则表达式判断输入框失去焦点事件
2019/10/16 Javascript
VUE单页面切换动画代码(全网最好的切换效果)
2019/10/31 Javascript
[01:23:59]2018DOTA2亚洲邀请赛 4.1 小组赛 B组 VP vs Secret
2018/04/03 DOTA
Python之PyUnit单元测试实例
2014/10/11 Python
Python实现批量下载文件
2015/05/17 Python
python 处理数字,把大于上限的数字置零实现方法
2019/01/28 Python
Django网络框架之创建虚拟开发环境操作示例
2019/06/06 Python
python manage.py runserver流程解析
2019/11/08 Python
解决ROC曲线画出来只有一个点的问题
2020/02/28 Python
Weekendesk意大利:探索多种引人入胜的周末主题
2016/10/14 全球购物
教师求职信范文分享
2013/12/27 职场文书
安全生产网格化管理实施方案
2014/03/01 职场文书
幼儿园见习报告范文
2014/10/30 职场文书
2014年乡镇安全生产工作总结
2014/12/02 职场文书
文明旅游倡议书
2015/04/28 职场文书
2016学习全国教书育人楷模先进事迹心得体会
2016/01/21 职场文书
《詹天佑》教学反思
2016/02/20 职场文书