> 웹 프론트엔드 > JS 튜토리얼 > HTML-CSS group_form 특수 효과에서 라디오 선택에 의해 트리거되는 '이벤트'

HTML-CSS group_form 특수 효과에서 라디오 선택에 의해 트리거되는 '이벤트'

WBOY
풀어 주다: 2016-05-16 19:18:14
원래의
1042명이 탐색했습니다.

사신의 라디오 버튼 문제로 많은 사람들이 헛소리를 하러 나왔다. 아아, 이 초보 수준의 사람도 험난한 바다에서 낚시를 하러 나왔다. 실수로 하나 만졌네요.

우선 바이두에서 발굴한 코드를 살펴보겠습니다.

코드 복사 코드는 다음과 같습니다.

<script> () <br>{ <br> for(i=0;i<document.form1.Fruit.length;i ) <BR> { <BR> if(document.form1.Fruit[i].checked) <BR> { > Alert("당신이 가장 좋아하는 과일은:" document.form1.Fruit[i].nextSibling.nodeValue) <BR> ;form name="form1"> 🎜><input type=radio value="Fruit1" name="Fruit" selected>Apple <br>< input type=radio value="Fruit2" name="Fruit">바나나 <br><입력 유형 =radio value="Fruit3" name="Fruit">딸기 <br><input type=radio value= "Fruit4" name="Fruit">파인애플 <br><input type=버튼 값="선택 " onclick="checkradio()"> <br></form> <br><br><br>이 코드의 목적은 선택한 값을 결정하는 것입니다. <br><br>이제 원하는 효과는 각 옵션이 비어 있는 경우 프롬프트를 표시하는 것입니다. 다음 코드는 변경 후의 효과입니다. <br><br> 프로그램 코드 <br><script> () <br>{ </div> var j=0; <br> for(i=0;i<document.form1.Fruit.length;i ) <br> { <br> if(document .form1.Fruit[ i].checked==true) <br> { <br> Alert("선택했습니다" document.form1.Fruit[i].nextSibling.nodeValue) <BR> { <BR> //break;Feifei 이후의 휴식 시간 지적하면 유효하지 않으니 삭제하세요 <BR>     } else{ <BR>           j=j 1;                                                                              좋아요!"); <BR>                                                                        열매는 다음과 같습니다.<BR><입력 유형=라디오 값= "Fruit1" name="과일"> <br>사과 <br><input type=radio value="Fruit2" name="과일 ">바나나<br><input type=radio value="Fruit3" name="과일">딸기<br><input type=radio value="Fruit4" name="Fruit">파인애플<br><input type=button value="선택" onclick="checkradio() "> <br></form> <br><br><br>나중에 Chen이 작성한 더 명확한 코드를 보았습니다. 코드 조각을 여기에 게시하세요. <br> (참고: 테스트의 편의를 위해 조금 변경했지만 아이디어는 여전히 그의 것입니다) <br><br><br><br><br>코드 복사<br><br><br> 코드는 다음과 같습니다.<br><div class="codebody" id="code32343"> <br><script> <br>function checkradio() <br>{ <br> var flag=false <br> for(var i=0;i<document.form1.Fruit.length- 1;i ) <BR>                                          alert ("^_^"); <BR> return false; <BR> }else{ <BR> Alert("영웅님, 하나만 선택하세요!"); 🎜> } <BR> </script>



라디오 선택이 끝났습니다. 페이페이 사장님은 밤에 포기하지 않고 체크박스 코드를 생각해 냈습니다.




코드 복사


코드는 다음과 같습니다.

<스크립트> 
    var j=document.getElementsByName("과일"); 
함수 allche(){ 
    for(var i=0; i             if(document.form1.Fruit[i].checked!=true) document.form1 .Fruit[i].checked= document.form1.suoy.checked; 
            if(document.form1.Fruit[i].checked==true) document.form1.Fruit[i].checked= document.form1.suoy.checked; 
    } 

function checkall(){ 
var aa=0 
    for(var i=0; i             if(document. form1.Fruit[i].checked == true)  aa ; 
             aa!=j.length ? document.form1.suoy.checked=false : document.form1.suoy.checked=true; 
    } 

function checkradio(){ 
var a=0 
var list="" 
for(var i=0; iif (document.form1.Fruit[i].checked== true){ 
list=="" ? list=document.form1.Fruit[i].value : list=list "," document.form1.Fruit[i].value; 

if (list!="") alert("你喜欢的水果是" list); 

else{ 
a ; 
if (a==j.length)alert("大哥。你道不选我怎么知道你喜欢什么?");} 


 
 
  您最喜欢的水果是:
 
   
  苹果 
   
  향초 
   
  草莓 
   
  凤梨 
   
  전체选 
 

 
함수 테스트() 

    과일 목록 = ""; 
    for(i=0;i        if(document.getElementById("frm")[i].type=="checkbox" && document. getElementById("frm")[i].checked) 
            fruitlist  = document.getElementById("frm")[i].value   " "; 
    if(fruitlist!="") 
        alert("你喜欢的水果是 " Fruitlist); 
    else 
        alert("大哥。你道不选我怎么知道你喜欢什么?"); 

  

再来一段更简洁的代码、效果更好的关于复选的代码。
复代代码 代码如下:

 
 
<본문> 
 
<입력 유형=체크박스 이름=C1>C1
 
<입력 유형=체크박스 이름=C2>C2
 
<입력 유형=체크박스 이름=C3>C3
 
<입력 유형=체크박스 이름=C4>C4
 
<입력 유형=체크박스 이름=C5>C5
 
<입력 유형=체크박스 이름=C6>C6
 
<입력 유형=체크박스 이름=C7>C7
 
<입력 유형=체크박스 이름=C8>C8
 
<입력 유형=체크박스 이름=C9>C9
 

 

 

 

 
 
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿