디스플레이

여기 나는 그들이 엘리트 옵션을 선택한 경우에 따라 콘텐츠를 표시하기 위해 함께 넣어 가지고 무엇을 선택하지만, 코드의 밤은 그렇게 고정 어떤 도움이 좋을 것 제대로 작동디스플레이

<style> 

.notelite{ 
display:none!important; 

} 

gotelite{ 
display:block!important; 
} 

</style> 
<script language="javascript"> 

if(document.getElementById('profile_field_7_10').value == "4") { 
document.getElementById('elitecontent').className="gotelite"; 
} 
if(document.getElementById('profile_field_7_10').value == "1") { 
document.getElementById('elitecontent').className="notelite"; 
} 
    if(document.getElementById('profile_field_7_10').value == "2") { 
document.getElementById('elitecontent').className="notelite"; 
} 

if(document.getElementById('profile_field_7_10').value == "3") { 
document.getElementById('elitecontent').className="notelite"; 
} 
if(document.getElementById('profile_field_7_10').value == "0") { 
document.getElementById('elitecontent').className="notelite"; 
} 
</script> 

<span id="elitecontent" style="cursor:pointer;">Decor</span>

또한 편집 할 수없는 자신의 순위를 보여주는 실제 콘텐츠가 있습니다 ... 광산이 엘리트로 선택되었으므로 어떤 옵션이 선택되었는지 = "선택됨"에 따라 자바 스크립트를 어떻게 변경합니까?

<span id="your_div_id_level"><dd><div class="field_uneditable">Elite</div> 
<div class="field_editable invisible"><select class="gensmall" id="profile_field_7_10" name="profile_field_7_10" size="1"> 
<option value="">No choice</option><option value="0">New Starter</option> 
<option value="1">Junior</option> 
<option value="2">Novice</option> 
<option value="3">Pro</option 
><option value="4" selected="selected">Elite</option></select></div></dd></span>

출처

2014-09-20 Leandra Katelyn

에 gotelite {에서 CSS를 변경해야 즉'gotelite'의 .gotelite'instead 안 { ...'(후자는 클래스 대신 gotelite라는 이름으로 dom 요소를 처리합니다). –

당신이 선택한 option의 값이 아닌 전체 select을 얻을 필요가있다. 그들은 엘리트이거나 그렇지 않은 경우, 단 하나의 if/else를 사용할 수도 있습니다.

이것은 더 잘 작동합니다. 스팬은 엘리트를 선택하면 보여줍니다 악셀이 코멘트에 말했듯이

<!doctype html> 
<html lang="en"> 
<head> 
    <style type="text/css"> 
    .notelite { 
     display:none!important; 
    } 

    .gotelite { 
     display:block!important; 
    } 

    </style> 
</head> 
<body> 
<span id="your_div_id_level"><dd><div class="field_uneditable">Elite</div> 
<div class="field_editable invisible"><select class="gensmall" id="profile_field_7_10" name="profile_field_7_10" size="1"> 
<option value="">No choice</option><option value="0">New Starter</option> 
<option value="1">Junior</option> 
<option value="2">Novice</option> 
<option value="3">Pro</option> 
<option value="4" selected="selected">Elite</option></select></div></dd></span> 

<span id="elitecontent" style="cursor:pointer;">Decor</span> 

<script type='text/javascript'> 
    // get the select 
    var elem = document.getElementById('profile_field_7_10'); 

    // get the value of the selected option 
    var value = elem.options[elem.selectedIndex].value; 

    // check if elite selected 
    if(value == "4") { 
     document.getElementById('elitecontent').className="gotelite"; 
    } 
    else { 
     document.getElementById('elitecontent').className="notelite"; 
    } 
</script> 
</body> 
</html>

은 또한 .gotelite {

출처

2014-09-20 18:57:37 Rhumborl

글쎄 시도했지만이 didnt가 작동하는 것, 나도 이것을 시도 ... 'var elem = document.getElementById ('profile_field_7_10'); var value = elem.options [elem.selectedIndex] .value; (값 == "4") { document.getElementById } else { document.getElementById ('elitecontent'). style.display = "none"; }' –

아마도 이것이 작동하지 않으면 div 클래스 field_uneditable에서 "Elite"텍스트를 확인할 수있는 방법이 있습니까? –

은 페이지의 맨 아래에있는 모든 html 요소 나 머리 부분의 스크립트 블록입니다. 그것이 머리에 있다면, window.onload 이벤트를 실행해야합니다. 그렇지 않으면 요소를 찾지 못할 것입니다. 아니면 다른 오류가보고 되나요? – Rhumborl

답변

관련 문제