JQuery操作select checkbox radio总结

时间:2022-09-10 13:00:34

JQuery是一个非常强大的工具,所以我必须找到它最方便的方法,嘻嘻

Select CRUD:

Select搜:

1.val值:

$("#selectid").val();       //最方便的

2.text值:

$("#selectid option:selected").text();       //最方便的

或 $("#selectid").find("option:selected").text()

3.Index值:

$("#selectid").get(0).selectedIndex;              //最方便的

Select改:

1.val值:

$("#selectid").val("xxx");               //最方便的

或 $("#selectid").attr("value","xxx");

2.text值:

$("#selectid option[text=abc]").attr("selected",true);              //最方便的

或 $("selectid option:contains(xxx)").attr("selected",true);

3.index值:

$("#select option[index=1]").attr("selected",true);                  //最方便的

Select增:

$("#selectid").append($("<opiton value='0'>张三</option>"));         //这两个都挺经常使用

$("#selectid").prepend($("<opiton value='0'>张三</option>"));

Select删:

清空:$("#selectid").empty();     //一般的插入前都会清空

部分删:

    $("#selectid option:gt(0)").remove();    //由于第一行有时候是tHead 的情况清空

    $("#selectid option[value=xxx]").remove();

       $("#selectid option[text=xxx]").remove();

       $("#selectid option[index=xxx]").remove();

select选中 不选中

$("#selectid").attr("selected",true);   

$("#selectid").attr("selected",false);

Radio查:

$("#radioid").val();

$("#radioid[name=xxx]").val();

$("#radioid[id=xxx]").val();

Radio改:

$("radioid[value=xxx]").attr("checked",true);

$("radioid:eq(1)").attr("checked",true);

Radio删:

$("radioid").remove();

Checkbox查:

$("#checkboxid").val();

$("#checkboxid[name=xxx]").val();

$("#checkboxid[id=xxx]").val();

Checkbox改:

$("checkboxid[value=xxx]").attr("checked",true);

$("checkboxid:eq(1)").attr("checked",true);

$(":button").bind("click",function(){              

   $(":checkbox").each(function(){

     //$(this).attr("checked",!$(this).attr("checked"));       点击buttoncheckbox反选;

     //$(this).attr("checked",true);       点击buttoncheckbox全选;

     $(this).attr("checked",false);       点击buttoncheckbox全不选;

     //if($(this).attr("checked")==true){alert($(this).val())}         选中的值

     //if($(this).attr("checked")==false){alert($(this).val())}        没选中的值

    })

  })

 })

Checkbox删:

$("checkboxid").remove();

txt文本框查:

$("#txtid").val();

txt文本框改:

$("#txtid").val("xx");

txt文本框删:

$("#txtid").val("");

jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中。及其相关

获 取一组radio被选中项的值

var item = $('input[name=items][checked]').val();

获 取select被选中项的文本

var item = $("select[name=items] option[selected]").text();

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

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

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

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

获取值:

文本框,文本区域:$("#txt").attr("value")。

多选框 checkbox:$("#checkbox_id").attr("value")。

单选组radio:   $("input[type=radio][checked]").val();

下拉框select: $('#sel').val();

控制表单元素:

文本框,文本区域:$("#txt").attr("value",'');//清空内容

$("#txt").attr("value",'11');//填充内容

多选框checkbox: $("#chk1").attr("checked",'');//不打勾

$("#chk2").attr("checked",true);//打勾

if($("#chk1").attr('checked')==undefined) //推断是否已经打勾

单选组 radio:    $("input[type=radio]").attr("checked",'2');//设置value=2的项目为当前选中项

下拉框 select:   $("#sel").attr("value",'-sel3');//设置value=-sel3的项目为当前选中项

$("<option value='1'>1111</option><option value='2'>2222</option>").appendTo("#sel")//加入下拉框的option

$("#sel").empty();//清空下拉框

版权声明:本文博主原创文章,博客,未经同意不得转载。

JQuery操作select checkbox radio总结的更多相关文章

  1. jquery 操作select&comma;checkbox&comma;radio (整理)

    在工作中经经常使用到select,checkbox,radio,今天有点空暇就整理一下,免得以后用的时候还要又一次找. 操作select下拉框 -- 获取值或选中项: 1, $("#sele ...

  2. Jquery操作select,radio,input,p之类

    select的操作 变化后触发操作 $("#txtaddprojecturl").change(function(){ $("#addprojectname") ...

  3. jQuery设置 select、radio、checkbox 默认选中的值

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. JQuery操作select下拉框

    JQuery操作select下拉框 获取Select选择的Text和Value $("#select_id").change(function(){//code...}); //为 ...

  5. Jquery操作select&comma;左右移动&comma;双击移动 取到所有option的值

    $(function () { function MoveItem(fromId, toId) { $("#" + fromId + " option:selected& ...

  6. ThinkPHP第二十六天&lpar;JQuery操作select&comma;SESSION和COOKIE&rpar;

    1.JQuery操作select,假设<select id="my"> A:双击选项<option>事件,应该是select的dbclick事件. B:获得 ...

  7. jquery操作select下拉框的各种方法,获取选中项的值或文本,根据指定的值或文本选中select的option项等

    简介jquery里对select进行各种操作的方法,如联动.取值.根据值或文本来选中指定的select下拉框指定的option选项,读取select选中项的值和文本等. 这一章,站长总结一下jquer ...

  8. js与jQuery操作select大全

    Js操作Select是很常见的,也是比较实用的,每一次操作select的时候,总是要出来翻一下资料,不如自己总结一下,以后就翻这里了. 一.js操作select部分 判断select选项中 是否存在V ...

  9. Jquery 操作 Select 详解

    jQuery是如何控制和操作select的.先看下面的代码 比如<select class="selector"></select> 1.设置value为p ...

随机推荐

  1. Build to win!——获得小黄衫的感想

    UPDATE: 应栋哥要求,上传了无遮挡的正面照(我的内心其实是拒绝的!(ㄒoㄒ)) 一.前言&背景 从大一上C++课程开始,栋哥就开始安利他大三的软工实践课. 时间过得飞快,大学转眼就过去一 ...

  2. Codeforces Round &num;331 &lpar;Div&period; 2&rpar;

    水 A - Wilbur and Swimming Pool 自从打完北京区域赛,对矩形有种莫名的恐惧.. #include <bits/stdc++.h> using namespace ...

  3. HDU 5800 (DP)

    Problem To My Girlfriend (HDU 5800) 题目大意 给定一个由n个元素组成的序列,和s (n<=1000,s<=1000) 求 :   f (i,j,k,l, ...

  4. memcached单点故障与负载均衡

    在上文中,主要教大家如何搭建在windows  IIS 7.5下搭建php环境,使用常见的两种memcached性能监视工具.通过自己动手实践,观察监控工具上数据,相信大家对于memcached的了解 ...

  5. C&num;超时处理&lpar;转载&rpar;

    /// <summary>    /// 超时处理    ///    ///    /// </summary>    public class TimeoutChecker ...

  6. NOPI使用手册

    目录 1. 认识NPOI 2. 使用NPOI生成xls文件 2.1 创建基本内容 2.1.1 创建Workbook和Sheet 2.1.2 创建DocumentSummaryInformation和S ...

  7. Python 编写一个有道翻译的 workflow 教程

    最近使用有道翻译的 workflow 总是翻译不了,可能是 appKey 失效了或者超过调用上限,所以打算自己实现一个. 创建 workflow 打开 Alfred3 的 Preferences,选择 ...

  8. HBuilder

    什么是HBuilder? HBbuilder是DCloud(数字天堂)推出的一款支持HTML5的WEB开发IDE,主体是由java编写的,它将HTML/JS代码块进行代码封装,达到简单数据形成代码的特 ...

  9. es6 语法 (模块化)

    //export export let A=123; //导出 //导出函数 export function test(){ console.log('test'); } //导出类 export c ...

  10. day04--流程控制之if

    编程的目的是让计算机像人脑一样工作,因此就需要让计算机具备人脑一样的逻辑思维,这里就需要用到计算机语言的流程控制: 流程控制之if......else 语法1: if 条件: 代码块 # 一组代码块的 ...