顯示選定

這裏是我已經把基礎上，如果他們有精英選項中選擇要顯示的內容，但代碼心不是合適的工作，所以一些幫助修復將是巨大的......顯示選定

<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>

這裏還有顯示他們排名的實際內容，我無法編輯......我被選爲Elite，所以如何根據選擇哪個選項=「選擇」來更改javascript？

<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 .gotelite'instead { ......「（後者將用」gotelite「這個名字代替一個類來解決dom元素）。 – 2014-09-20 18:51:25

你需要得到所選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 {的css來.gotelite {

來源

2014-09-20 18:57:37 Rhumborl

嗯，我試過了，但這似乎並沒有工作，我也試過這個...... 'var elem = document.getElementById（'profile_field_7_10'）; var value = elem.options [elem.selectedIndex] .value;如果（value ==「4」）{ if（value ==「4」）document.getElementById（'elitecontent'）。style.display =「block」; } else { document.getElementById（'elitecontent'）。style.display =「none」; }' – 2014-09-20 19:49:41

也許相反，如果這不起作用有沒有辦法檢查div類中的「Elite」文本field_uneditable？ – 2014-09-20 20:15:11

是你的腳本塊在所有的HTML元素或在頭後的頁面底部。如果它在頭部，你將需要運行一個window.onload事件，否則它不會找到元素。或者你有任何其他錯誤報告？ – Rhumborl 2014-09-20 21:24:57

回答

相關問題