久久国产成人av_抖音国产毛片_a片网站免费观看_A片无码播放手机在线观看,色五月在线观看,亚洲精品m在线观看,女人自慰的免费网址,悠悠在线观看精品视频,一级日本片免费的,亚洲精品久,国产精品成人久久久久久久

分享

js原生、jquery單選框radio總結(jié)(獲取值,、設置默認選中值,、樣式)

 hncdman 2022-12-14 發(fā)布于湖南

單選框 radio總結(jié):

一、頁面樣式截圖:

<div class="radio-inline">

  <input type="radio"  name="killOrder" id="killOrder1" value="1"/>

  <label for="killOrder1">是</label>

</div>

<div class="radio-inline">

  <input type="radio"  name="killOrder" id="killOrder2" value="0" checked/>

  <label for="killOrder2">否</label>

</div>

使用label標簽可以點擊文字就能選中單選框或者是取消選擇單選框 

label標簽的兩種使用方法:   https://blog.csdn.net/qq_40015157/article/details/110850331

二,、js原生

1,、js原生獲取選中的值

var tesObj = document.getElementsByName("killOrder");

//獲取選中的值

for(var i=0; i < tesObj.length; i++){

  if (tesObj[i].checked==true){

         alert(tesObj[i].value+'  是選中的value值');

         break;

    }

}

2、js原生設置選中

var tesObj = document.getElementsByName("killOrder");

//設置value值為0選中

for(var i=0; i < tesObj.length; i++){

  if (tesObj[i].value=="0"){

           tesObj[i].checked = true;

           break;

    }

}

三,、jquery

1.獲取值

$("input[name='killOrder']:checked").val();

$('input:radio:checked').val();

$("input[type='radio']:checked").val();

$(":radio[checked]").each(function(radio){alert($(this).val());

注意:有時attr() 無法起到作用,,attr() 與 prop() 的區(qū)別詳見文章。   https://blog.csdn.net/qq_40015157/article/details/110823718

2.設置第一個radio為選中值:

$('input:radio:first').prop('checked', 'checked');

$('input:radio:first').prop('checked', true);

$('input:radio:first').attr('checked', 'checked');

$('input:radio:first').attr('checked', true);

3.設置最后一個radio為選中值:

$('input:radio:last').prop('checked', 'checked');

$('input:radio:last').prop('checked', true);

$('input:radio:last').attr('checked', 'checked');

$('input:radio:last').attr('checked', true);

4.根據(jù)索引值設置任意一個radio為選中值:

$('input:radio').eq(索引值).prop('checked', true);//索引值=0,1,2....

$('input:radio').slice(1,2).prop('checked', true);

$('input:radio').eq(索引值).attr('checked', true);//索引值=0,1,2....

$('input:radio').slice(1,2).attr('checked', true);

5.根據(jù)value值設置radio為選中值

$("input:radio[value='2']").prop('checked', true);

$("input[value='1']").prop('checked', true);

$("input[name='killOrder'][value='1']").prop("checked", "checked");

let v = 1;//變量

$("input[name='killOrder'][value='" + v + "']").prop("checked", true);

$("input:radio[value='2']").attr('checked', true);

$("input[value='1']").attr('checked', true);

6.刪除value值為2的radio

$("input:radio[value='2']").remove();

7.刪除第幾個radio

$("input:radio").eq(索引值).remove();//索引值=0,1,2....

//如刪除第3個radio:$("input:radio").eq(2).remove();

8.遍歷radio

$('input:radio').each(function(index,domEle){

     //寫入代碼

});

9.修改單選框樣式

input[type="radio"] + label::before {

    content: "\a0";

    display: inline-block;

    vertical-align: middle;

    width: 15px;

    height: 15px;

    margin-right: 5px;

    border-radius: 50%;

    text-indent: .15em;

    margin-bottom: 4px;

    border: 1px solid #CCCCCC;

}

input[type="radio"]:checked + label::before {

    background-color: #4A90E2;

    background-clip: content-box;

    padding: 2px;

}

input[type="radio"] {

    position: absolute;

    clip: rect(0, 0, 0, 0);

}

.radio-inline{

    padding-left: 0;

}

input[type=radio][disabled]:checked + label::before{

    background-color:#CCCCCC;

    background-clip: content-box;

    padding: 2px;

}

復選框總結(jié) :   https://blog.csdn.net/qq_40015157/article/details/110819778 

全選反選 :https://blog.csdn.net/qq_40015157/article/details/110661715

https://blog.csdn.net/qq_40015157/article/details/80693777

輸入框: https://blog.csdn.net/qq_40015157/article/details/80692543

————————————————

版權聲明:本文為CSDN博主「程序媛zcx」的原創(chuàng)文章,遵循CC 4.0 BY-SA版權協(xié)議,,轉(zhuǎn)載請附上原文出處鏈接及本聲明,。

原文鏈接:https://blog.csdn.net/qq_40015157/article/details/80692296

JQuery控制radio選中和不選中方法總結(jié)

一、設置選中方法

復制代碼代碼如下:

$("input[name='名字']").get(0).checked=true; 
$("input[name='名字']").attr('checked','true');
$("input[name='名字']:eq(0)").attr("checked",'checked'); 
$("input[name='radio_name'][checked]").val();  //獲取被選中Radio的Value值

二,、設置選中和不選中示例

復制代碼代碼如下:

<input type="radio" value="0" name="jizai" id="0"/>否
<input type="radio" value="1" name="jizai"  id="1"/>是
#jquery中,,radio的選中與否是這么設置的。
$("#rdo1").attr("checked","checked");
$("#rdo1").removeAttr("checked");

通過name

復制代碼代碼如下:

$("input:radio[name="analyfsftype"]").eq(0).attr("checked",'checked');
$("input:radio[name="analyshowtype"]").attr("checked",false);

通過id

復制代碼代碼如下:

$("#tradeType0").attr("checked","checked");
$("#tradeType1").attr("checked",false);

三,、另一種設置選中方法

復制代碼代碼如下:

<script type="text/javascript">  
$(document).ready(function(){  
        $("input[@type=radio][name=sex][@value=1]").attr("checked",true);  
});  
</script>  

您的性別:  

復制代碼代碼如下:

<input type="radio" name="sex" value="1" <s:if test="user.sex==1">checked</s:if>/>男  
<input type="radio" name="sex" value="0" <s:if test="user.sex==0">checked</s:if>/>女

四,、根據(jù)值設置radio選中

復制代碼代碼如下:

$("input[name='radio_name'][value='要選中Radio的Value值']").attr("checked",true);  //根據(jù)Value值設置Radio為選中狀態(tài)

五、使用prop方法操作示例

復制代碼代碼如下:

$('input').removeAttr('checked'); 
$($('#'+id+'input').eq(0)).prop('checked',false);
$($('#'+id+' input').eq(0)).prop('checked',true);


JQuery radio(單選按鈕)操作方法匯總

隨著Jquery的作用越來越大,,使用的朋友也越來越多,。在Web中,由于CheckBox,、Radiobutton ,、DropDownList等控件使用的頻率比較高,就關系到這些控件在Jquery中的操作問題,。由于Jquery的版本更新很快,,代碼的寫法也改變了許多,以下Jquery代碼適query1.4版本以上,。

1.獲取選中值,,三種方法都可以:

復制代碼代碼如下:

$('input:radio:checked').val();
$("input[type='radio']:checked").val();
$("input[name='rd']:checked").val();

2.設置第一個Radio為選中值:

復制代碼代碼如下:

    $('input:radio:first').attr('checked', 'checked');

或者

復制代碼代碼如下:

$('input:radio:first').attr('checked', 'true');

注:attr("checked",'checked')= attr("checked", 'true')= attr("checked", true)

3.設置最后一個Radio為選中值:

復制代碼代碼如下:

$('input:radio:last').attr('checked', 'checked');

或者

復制代碼代碼如下:

$('input:radio:last').attr('checked', 'true');

4.根據(jù)索引值設置任意一個radio為選中值:

復制代碼代碼如下:

$('input:radio').eq(索引值).attr('checked', 'true');索引值=0,1,2....

或者

復制代碼代碼如下:

$('input:radio').slice(1,2).attr('checked', 'true');

5.根據(jù)Value值設置Radio為選中值

復制代碼代碼如下:

$("input:radio[value='rd2']").attr('checked','true');

或者

復制代碼代碼如下:

$("input[value='rd2']").attr('checked','true');

6.刪除Value值為rd2的Radio

復制代碼代碼如下:

$("input:radio[value='rd2']").remove();

7.刪除第幾個Radio

復制代碼代碼如下:

$("input:radio").eq(索引值).remove();索引值=0,1,2....

如刪除第3個Radio:$("input:radio").eq(2).remove();

8.遍歷Radio

復制代碼代碼如下:

$('input:radio').each(function(index,domEle){

     //寫入代碼

});


 

jquery判斷單選按鈕radio是否選中的方法

本文實例講述了jquery判斷單選按鈕radio是否選中的方法,。分享給大家供大家參考,。具體如下:

html代碼如下:

1
2
3
<input type="radio" id="d1" name="ra" value="a" checked="checked" />
<input type="radio" id="d2" name="ra" value="b" />
<input type="radio" id="d3" name="ra" value="c" />

1. 加載頁面的時候獲取id

1
2
3
4
5
6
7
8
$("input[type='radio']").each(function(){
  var id= $(this).attr("id");
  if($("#"+id).attr("checked")=="checked"){
   var fs=$("#"+id).val();
  }
});
var s1 = $(".aa:checked").val(); // .aa 為class
var s2 = $("input[name='ra']:checked").val();

2.點擊按鈕的時候獲取id

1
2
3
4
5
6
$(function(){
  $("input[type='radio']").click(function(){
    var id= $(this).attr("id");
    alert(id);
  });
});
 

    本站是提供個人知識管理的網(wǎng)絡存儲空間,所有內(nèi)容均由用戶發(fā)布,,不代表本站觀點,。請注意甄別內(nèi)容中的聯(lián)系方式、誘導購買等信息,,謹防詐騙,。如發(fā)現(xiàn)有害或侵權內(nèi)容,請點擊一鍵舉報,。
    轉(zhuǎn)藏 分享 獻花(0

    0條評論

    發(fā)表

    請遵守用戶 評論公約