1.jquery操作radio

 

<html>
<head>
 
<script type="text/javascript" src="jquery-1.8.2.min.js">    </script>
 
    <title></title>
<!-- jquery判断哪个radio被选中  -->
    <script type="text/javascript">
        $(function(){
        $('#button1').bind('click',function(){
        var isChecked=$("input[name='radioall']").each(function(){
        if($(this).attr('checked')=='checked'){
        alert($(this).attr('value'));
        }
        });
        });   
        });
    </script>
 
 
<!-- jquery判断哪个radio被选中  -->
    <script type="text/javascript">
        $(function(){
        $('#button1').bind('click',function(){
        var value=$("input[name='radioall']:checked").val();
        });   
        });
    </script>
 
<!-- jquery选中取消radio  -->   
    <script type="text/javascript">
        2//选中
        $(function(){
        $('#button2').bind('click',function(){
        $('#radio3').attr('checked',true);
        });   
        //取消
        $('#button3').bind('click',function(){
        $('#radio3').attr('checked',false);
        });           
        });
    </script>
 
<!-- jquery获取radio属性  -->       
    <script type="text/javascript">
        //获取值
        $(function(){
        $('#button4').bind('click',function(){
        var value=$('#radio4').attr('value');
        alert(value);
        });   
            });       
    </script>
 
 
    <script type="text/javascript">
        //获取值用,分隔
 
        $(function(){
 
        $('#button5').bind('click',function(){
        var str='';           
        var value=$("input[name='Checkbox8']").each(function(){
        if($(this).attr("checked")=='checked'){
        str += $(this).attr('value')+',';
        }
        });
        var index=str.lastIndexOf(',');
 
        str=str.substring(0,index);
        alert(str);       
        });   
            });       
    </script>       
 
</head>
<body>
<p>1.jquery判断哪个radio被选中</p><input />
<input type="radio" />radio1
<input type="radio" />radio2
<hr/>
<p>2.jquery选中取消一个radio</p><input />
<input type="radio" />radio3
<hr/>
<p>4.jquery获取radio的值</p><input />
<input type="radio" />radio4
<hr/>
</body>
</html>
 
 
 jquery操作select
 
<html>
<head>
 
<script type="text/javascript" src="jquery-1.8.2.min.js">    </script>
 
    <title></title>
<!-- jquery判断哪个option被选中  -->
    <script type="text/javascript">
        $(function(){
        $('#button1').bind('click',function(){
        var text1=$('#select1 option:selected').text();
        alert("text1是"+text1);       
        var text2=$("#select1").find('option:selected').text();//等同上
        alert("text2是"+text2);       
        var text3=$("#select1").text();
        alert("text3是"+text3);
 
        var value1=$("#select1").val();
        alert("value1是"+value1);       
        var value2=$('#select1 option:selected').attr('value');       
        alert("value2是"+value2);       
        });   
        });
    </script>
 
<!-- jquery选中option  -->   
    <script type="text/javascript">
        2//选中
        $(function(){
        $('#button2').bind('click',function(){
        $("#select2 [value=99]").attr('selected','selected');
        //$("#select2").attr("value",'88');设值有88的为选中项
 
        });           
        });
    </script>
 
<!-- jquery增加一个option  -->   
    <script type="text/javascript">
        2//选中
        $(function(){
        $('#button3').bind('click',function(){
        $("<option id='15' value='155'>15</option>").appendTo("#select3")//添加下拉框的option
 
        });           
        });
    </script>
 
<!--移除一个option -->   
    <script type="text/javascript">
        2//选中
        $(function(){
        $('#button4').bind('click',function(){
        $("#select4 [value=133]").remove();
 
        });           
        });
    </script>       
 
<!-- jquery清空option  -->   
    <script type="text/javascript">
        2//选中
        $(function(){
        $('#button5').bind('click',function(){
        $("#select5").empty()
 
        });           
        });
    </script>   
 
 
</head>
<body>
<p>1.jquery判断哪个option被选中,并且获取该值</p><input />
<select >
  <option ></option>
  <option >1</option>
  <option >2</option>
  <option >3</option>
  <option >4</option>
</select>
<hr/>
<p>2.jquery选中一个option</p><input />
<select >
  <option ></option>
  <option >6</option>
  <option >7</option>
  <option >8</option>
  <option >9</option>
</select>
<hr/>
<p>3.jquery增加一个option</p><input />
<select >
  <option ></option>
  <option >11</option>
  <option >12</option>
 
</select>
<hr/>
<p>4.移除option</p><input />
<select >
  <option >13</option>
  <option >14</option>
</select>
<hr/>
<p>5.清空option</p><input />
<select >
  <option ></option>
  <option >166</option>
  <option >177</option>
  <option >188</option>
  <option >199</option>
</select>
<hr/>
</body>
</html>
 
 
 
 
 jquery操作checkbox
 
 
 
<html>
<head>
 
<script type="text/javascript" src="jquery-1.8.2.min.js">    </script>
 
    <title>获取对象宽度</title>
 
    <script type="text/javascript">
        //判断是否选中
        $(function(){
        $('#button1').bind('click',function(){
        var isChecked=$('#Checkbox1').attr('checked');
        alert(isChecked);
        if(isChecked=='checked'){
        alert('选中了');
        }
        else if(typeof(isChecked)==undefined){
        alert('未选中');       
        }/*       
        else if(typeof(isChecked)=='undefined'){
        alert('未选中');       
        }*/
        });   
        });
    </script>
 
 
    <script type="text/javascript">
        //选中
        $(function(){
        $('#button2').bind('click',function(){
        $('#Checkbox2').attr('checked',true);
        });   
        //取消
        $('#button3').bind('click',function(){
        $('#Checkbox2').attr('checked',false);
        });           
        });
    </script>
 
 
    <script type="text/javascript">
        $(function(){
        $('#Checkbox2').bind('click',function(){
        if($(this).attr('checked')=='checked'){
        $("input[name='Checkboxone']").each(function(){
        $(this).attr('checked','checked');   
        //$(this).attr('checked',true);    效果一样?       
        });   
        }
        });   
 
        $('#Checkbox2').bind('click',function(){
        if($(this).attr('checked')==undefined){
        $("input[name='Checkboxone']").each(function(){
        $(this).attr('checked',false);   
        });   
        }
        });       
 
        });
    </script>   
 
    <script type="text/javascript">
        //获取值
        $(function(){
        $('#button4').bind('click',function(){
        var value=$('#Checkbox7').attr('value');
        alert(value);
        });   
            });       
    </script>
 
 
    <script type="text/javascript">
        //获取值用,分隔
 
        $(function(){
 
        $('#button5').bind('click',function(){
        var str='';           
        var value=$("input[name='Checkbox8']").each(function(){
        if($(this).attr("checked")=='checked'){
        str += $(this).attr('value')+',';
        }
        });
        var index=str.lastIndexOf(',');
 
        str=str.substring(0,index);
        alert(str);       
        });   
            });       
    </script>       
 
</head>
<body>
<p>1.jquery判断checkbox是否被选中</p><input />
<input type="Checkbox" />Checkbox1
<p>注意:若选中,则打印出的是chenked,没选中则为undefined</p>
<hr/>
<p>2.jquery选中取消一个checkbox</p><input />
<input type="Checkbox" />Checkbox2
<hr/>
<p>3.jquery全选/全取消</p>
<input type="Checkbox" />全选
<input type="Checkbox" />Checkbox4
<input type="Checkbox" />Checkbox5
<input type="Checkbox" />Checkbox6
<hr/>
<p>4.jquery获取checkbox的值</p><input />
<input type="Checkbox" />Checkbox7
<hr/>
<p>5.jquery获取选中的checkbox的值组成字符串</p><input />
<input type="Checkbox" />Checkbox8
<input type="Checkbox" />Checkbox8
<input type="Checkbox" />Checkbox8
<input type="Checkbox" />Checkbox8
</body>
</html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

 

相关文章: