如何在運行中檢測元素的更改？

-3

我有一個下拉菜單，取決於選擇，我想顯示/隱藏另一個元素。如何在運行中檢測元素的更改？

目前的HTML看起來像這樣：

<div class="main-element"> 
    <div class="something"> 
     <span>Off</span> 
     <select name="example"> 
      <option value="off" selected="selected">Off</option> 
      <option value="on">On</option></select> 
     </select> 
    </div> 
</div>

當你點擊下拉菜單，然後單擊上，跨度變化 <span>On</span>（用戶看到在作爲選擇的選項）

如果保存更改，那麼On選項將刷新selected="selected"。

目前爲止還不錯，但我想要做的事情，所以當用戶改變選擇下拉關/開，我想另一個元素顯示/隱藏。

如何在JavaScript中執行以下操作？

If main-element select is clicked { 
    if <span>On</span> exists { then show X element } 
    else { hide X element} 
}

因此，它顯示/隱藏在飛行X元素，而不是僅僅在第一負載。

來源

2013-06-24 user2413333

是否這樣？ DEMO

$('select').change(function() { 
    var theValue = $('option:selected').val(); 
    if (theValue == 'on') { 
     $('.hidden').show(); 
     $('span').html('On'); 
    } else { 
     $('.hidden').hide(); 
     $('span').html('Off'); 
    } 
});

來源

2013-06-24 18:56:18 Turnip

「如果你保存更改，然後在選項選擇=」選擇「在刷新」 ......你需要做到這一點與cookie或會話變量。

要改變跨度當您更改選擇輸入：

HTML：

<span id="span">Off</span> 
<select id="example" name="example.....

的Javascript：

document.getElementById("example").onchange = function() { 
    document.getElementById("span").innerHTML = document.getElementById("example").value; 
}

基本上這一點。試試這個：http://jsfiddle.net/wmh6b/

或者，如果你喜歡jQuery，試試這個：http://jsfiddle.net/wmh6b/1/

來源

2013-06-24 19:06:04

如何在運行中檢測元素的更改？

回答

相關問題