자바에서 숨기고보기

그러나 작업 동적 라디오 버튼을 가지고,하지만 난 그것을 숨길 당신이 하나의 옵션이 다른에 보인다 선택할 때 자바 스크립트

에 새로운 오전? 이것을 고쳐라?

무전기 : NO • YES • • 기타

<div id="hide"> FORM FOR YES </div> 
<div id="hide2">FORM FOR OTHER </div>

내가 선택

"예"를 선택한 다음 "기타"사업부를 숨길 수있는 두 개의 div의로 나타나고있다

및 사업부 숨기기 ... "숨는 장소". 이 경우에만 "예"를 선택한 다음 "오허"를 선택하십시오.

window.onload=function(){ document.getElementById('hide').style.display="none"; document.getElementById('hide2').style.display="none"; } function possui_dominio() { if(document.getElementsByName('form[dominio]')[0].checked) document.getElementById('hide').style.display="inline"; if(document.getElementsByName('form[dominio]')[1].checked) document.getElementById('hide').style.display = 'none'; document.getElementById('hide2').style.display = 'none'; if(document.getElementsByName('form[dominio]')[2].checked) document.getElementById('hide2').style.display="inline"; } </script>

나쁜 영어 죄송합니다 좀 도와 사람들을 주셔서 감사합니다.

출처

2011-11-13 user1044351

정말 고맙습니다. 고맙습니다. 결정된!! – user1044351

이것은 항상 괄호 안에 블록을 감싸는 (조건부/반복)해야하는 좋은 예입니다. 그렇게하지 않으면 현명한 코드를 작성하는 것뿐만 아니라 몇 달 후 디버깅하거나 이해하기가 매우 어렵습니다. – BryanH

는이처럼 기능의 다른 요소를 숨길 필요가 :

이

function possui_dominio() 
{ 
    if(document.getElementsByName('form[dominio]')[0].checked){ 
     document.getElementById('hide2').style.display="none"; 
     document.getElementById('hide').style.display="inline"; 
    } 

    if(document.getElementsByName('form[dominio]')[1].checked){ 
     document.getElementById('hide').style.display = 'none'; 
     document.getElementById('hide2').style.display = 'none'; 
    } 

    if(document.getElementsByName('form[dominio]')[2].checked){ 
     document.getElementById('hide2').style.display="inline"; 
     document.getElementById('hide').style.display="none"; 
    } 
}

출처

2011-11-13 17:03:31 nillls

ohhhh = D, 완벽하게 일한 덕분에 그게 내가 놓친 것입니다. – user1044351

이 최적화는 양식 컬렉션을 다음과 같은 변수에 저장하는 것입니다. var myForm = document.getElementsByName ('form [dominio]'); 그런 다음 if 문에서 myForm [0] .checked, myForm [1] .checked 등을 사용합니다. 이렇게하면 DOM 통과는 한 번 발생합니다. – nillls

-1

How to use jQuery to show/hide divs based on radio button selection?

사용하는 이름, (이 경우)하지 ID입니다. 이름은 동일해야합니다.

은 jQuery와 같은 프레임 워크를 사용합니다.이 프레임 워크는 순수 JavaScript를 사용하는 것보다 브라우저 간의 차이점을 훨씬 잘 처리합니다.

마지막으로 JavaScript는/not/Java입니다.

if (condition) 
    statement;

당신은 조건이 true 경우이 문을 실행하려면

, 당신은 ({}), 그래서 괄호로 그 문을 추가해야한다

자바 스크립트에서

출처

2011-11-13 16:58:24

그리고 JavaScript는 jQuery가 아닙니다. "jQuery 솔루션을 제안 해주십시오"와 같은 문장을 보았습니까? –

OP가/a/solution을 좋아할 것이라는 암시가있었습니다. 나는 해결책을 제시했다. 나는 너의 것을 보지 못한다. –

@ KaeVerens 대부분의 사람들이 jquery를 요청할 때 비평받을 수 있기 때문에 순수 js 대안으로 내 시간을 낭비하지도 않습니다. – david

, if 문은 항상이 계획에 따라 그들은 모두 함께 실행된다는 점 :

if (condition) 
    statement1; 
statement2;

: 두 번째 if 문 (물론 형식)과 같습니다

if (condition) { 
    statement1; 
    statement2; 
}

두 번째 문은 if 문과 아무 관련이 없으므로 항상 실행됩니다.

출처

2011-11-13 17:02:29 Yogu

이 당신을 위해 간단한 예입니다.

<html> 
<head> 
<title>Hide/Show Pane Javascript</title> 
<script type="text/javascript"> 
    function togglePane(pane_id){ 
    //alert(pane_id) 
     var current_pane = document.getElementById('pane_'+pane_id); 
     //alert(current_pane); 
     if(pane_id == 1){ 
      current_pane.style.display = 'block'; 
      document.getElementById('pane_2').style.display = 'none'; 
      document.getElementById('pane_3').style.display = 'none'; 
     } else if(pane_id == 2){ 
      current_pane.style.display = 'block'; 
      document.getElementById('pane_1').style.display = 'none'; 
      document.getElementById('pane_3').style.display = 'none'; 
     } else if(pane_id == 3){ 
      current_pane.style.display = 'block'; 
      document.getElementById('pane_1').style.display = 'none'; 
      document.getElementById('pane_2').style.display = 'none'; 
     } 
    } 
</script> 
</head> 
<body> 
<input type="radio" name="option" id="option1" value="1" checked="checked" onclick="togglePane(1)"><label for="option1">Yes</label> 
<input type="radio" name="option" id="option2" value="2" onclick="togglePane(2)"><label for="option2">No</label> 
<input type="radio" name="option" id="option2" value="3" onclick="togglePane(3)"><label for="option3">Other</label> 
<div id="pane_1" style="display: block">Yes Block</div> 
<div id="pane_2" style="display: none">No Block</div> 
<div id="pane_3" style="display: none">Other Block</div> 
</body> 
</html>

출처

2011-11-13 17:13:06

자바에서 숨기고보기

답변

관련 문제