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 相关文章推荐
jQuery学习笔记之jQuery选择器的使用
Dec 22 Javascript
event.currentTarget与event.target的区别介绍
Dec 31 Javascript
node.js中的socket.io入门实例
Apr 26 Javascript
javascript中DOM复选框选择用法实例
May 14 Javascript
JavaScript模拟实现键盘打字效果
Jun 29 Javascript
js密码强度校验
Nov 10 Javascript
浅谈bootstrap源码分析之scrollspy(滚动侦听)
Jun 06 Javascript
jQuery实现的右下角广告窗体跟随效果示例
Sep 16 Javascript
Vue实现virtual-dom的原理简析
Jul 10 Javascript
对vue 键盘回车事件的实例讲解
Aug 25 Javascript
用Golang运行JavaScript的实现示例
Nov 25 Javascript
Vue获取微博授权URL代码实例
Nov 04 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
Php注入点构造代码
2008/06/14 PHP
PHP Reflection API详解
2015/05/12 PHP
PHP实现随机生成水印图片功能
2017/03/22 PHP
详解如何在云服务器上部署Laravel
2017/06/30 PHP
PHP操作redis实现的分页列表,新增,删除功能封装类与用法示例
2018/08/04 PHP
jQuery学习笔记 操作jQuery对象 文档处理
2012/09/19 Javascript
用unescape反编码得出汉字示例
2014/04/24 Javascript
jQuery $.extend()用法总结
2014/06/15 Javascript
JQuery 使用attr方法实现下拉列表选中
2014/10/13 Javascript
javascript继承的六大模式小结
2015/04/13 Javascript
Jquery中基本选择器用法实例详解
2015/05/18 Javascript
nodejs实现获取某宝商品分类
2015/05/28 NodeJs
基于jQuery全屏焦点图左右切换插件responsiveslides
2015/09/07 Javascript
js格式化时间的简单实例
2016/11/27 Javascript
使用vue-router设置每个页面的title方法
2018/02/11 Javascript
微信小程序网络请求封装示例
2018/07/24 Javascript
用vue写一个日历
2020/11/02 Javascript
Python中的作用域规则详解
2015/01/30 Python
举例介绍Python中的25个隐藏特性
2015/03/30 Python
python检查URL是否正常访问的小技巧
2017/02/25 Python
Python列表list解析操作示例【整数操作、字符操作、矩阵操作】
2017/07/25 Python
python logging.basicConfig不生效的原因及解决
2020/02/20 Python
通过代码实例了解Python sys模块
2020/09/14 Python
GitHub上值得推荐的8个python 项目
2020/10/30 Python
联想加拿大官方网站:Lenovo Canada
2018/04/05 全球购物
北京某公司的.net笔试题
2014/03/20 面试题
社区工作者感言
2014/03/02 职场文书
2014年公司植树节活动方案
2014/03/04 职场文书
党建目标管理责任书
2014/07/25 职场文书
领导班子四风查摆对照检查材料思想汇报
2014/10/05 职场文书
机关作风建设自查报告
2014/10/22 职场文书
2014七年级班主任工作总结
2014/12/05 职场文书
创业计划书之o2o水果店
2019/08/30 职场文书
写给医护人员的一封感谢信
2019/09/16 职场文书
数据库之SQL技巧整理案例
2021/07/07 SQL Server
Python使用mitmproxy工具监控手机 下载手机小视频
2022/04/18 Python