jQuery操作radio、checkbox、select示例

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> jQuery操作radio、checkbox、select示例 </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <script src="http://code.jquery.com/jquery-1.11.1.min.js" ></script>
 </head>

 <body>
  <div>
                <input type="radio" name="radio" id="radio1" value="radio1" />radio1
                <input type="radio" name="radio" id="radio2" value="radio2" />radio2
                <input type="radio" name="radio" id="radio3" value="radio3" />radio3
                <input type="radio" name="radio" id="radio4" value="radio4" />radio4   

                <br/>

                <input type="checkbox" name="checkbox" id="checkbox_id1" value="checkbox1" />checkbox1
                <input type="checkbox" name="checkbox" id="checkbox_id2" value="checkbox2" />checkbox2
                <input type="checkbox" name="checkbox" id="checkbox_id3" value="checkbox3" />checkbox3
                <input type="checkbox" name="checkbox" id="checkbox_id4" value="checkbox4" />checkbox4
                <input type="checkbox" name="checkbox" id="checkbox_id5" value="checkbox5" />checkbox5    

                <br/>

                <select name="select" id="select_id" style="width: 100px;">
                    <option value="select1">select1</option>
                    <option value="select2">select2</option>
                    <option value="select3">select3</option>
                    <option value="select4">select4</option>
                    <option value="select5">select5</option>
                    <option value="select6">select6</option>
                </select>   

                <br/>

                <span onclick="show()">点击</span>

  </div>
      <script>

            function show()
            {
                //jquery获取单选框的值
                alert($(‘input[type="radio"][name="radio"]:checked‘).val());

                //jquery循环输出选中的值
                $("input[type=checkbox][name=checkbox]:checked").each(function(){
                    alert($(this).val());
                });    

                //jquery获取Select选中项的Value
                alert($("#select_id").val());

                //jquery获取Select选中项的Text
                alert($("#select_id :selected").text());
            }

    </script>
 </body>
</html>

jQuery操作radio、checkbox、select示例

时间: 2024-10-04 15:37:03

jQuery操作radio、checkbox、select示例的相关文章

jQuery 操作 radio、select、checkbox

<script type="text/javascript"> $(function () { 一.radio 1.获取选中值,三种方法都可以: $('input:radio:checked').val(): $("input[type='radio']:checked").val(); $("input[name='rd']:checked").val(); 2.设置第一个radio为选中值: $('input:radio:firs

jquery操作radio,checkbox

1. 获取radio选中的value. $('input:radio[name=sex]:checked').val(); 2. 选择 radio 按钮 (Male). $('input:radio[name=sex]:nth(0)').attr('checked',true);或者$('input:radio[name=sex]')[0].checked = true; 3. 选择 radio 按钮 (Female). $('input:radio[name=sex]:nth(1)').att

jquery操作单选钮代码示例

jquery操作单选钮代码示例:radio单选按钮是最重要的表单元素之一,下面介绍一下常用的几个jquery对radio单选按钮操作.一.取消选中: $(".theclass").each(function(){ if($(this).attr('checked')) { $(this).attr('checked',false); } }); 以上代码可以将class属性值为theclass的被选中单选按钮取消选中.二.获取被选中的单选按钮的值: var val=$('.thecla

JSP的3种方式实现radio ,checkBox,select的默认选择值

JSP的3种方式实现radio ,checkBox,select的默认选择值.以radiao 为例:第一种方式:在jsp中使用java 脚本,这个方法最直接,不过脚本太多,不容易维护<%String state = request.getParrameter("state" )%> <td width="27"><input type="radio" name="state" value=&quo

jquery 【radio checkbox】选择

<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script src="Jquery/jquery-1.10.2.js" type="text/javascript"></script> <script type="text/javascript"> $(f

使用JQUERY操作Radio

发展中经常使用Radio为了实现用户的选择的影响.我在该项目中使用的一些JQUERY操作Radio该方法.这里分享,对于有需要的朋友参考的. 1.变化radio选择.引发一些结果 $("input:radio[name='dialCheckResult']").change(function (){                    //拨通 alert("123"); }); 2.让页面中全部的radio可用. $("input:radio"

jquery操作radio(单选按钮):动态选中、取值

jquery确实要比js用起来方便多了,尤其是在操作网页里的表单项方面,这章站长和大家分享用Jquery操作单选按钮radio,实现动态选中某个单选按钮和读取选中的单选按钮的值的方法, 本文来自天使建站 www.angelweb.cn 先来看一个实例及代码: <script> $(":radio[name='angelasp'][value='angel']").attr("checked","true"); </script&

jQuery操作radio、checkbox、select总结

本文转自:http://tiame.iteye.com/blog/1493261 1.radio:单选框 HTML代码: Html代码   <input type="radio" name="radio" id="radio1" value="1" />1 <input type="radio" name="radio" id="radio2" va

jQuery操作radio、checkbox、select 集合

1.radio:单选框 HTML代码: <input type="radio" name="radio" id="radio1" value="1" />1 <input type="radio" name="radio" id="radio2" value="2" />2 <input type="radi