在單擊按鈕後顯示下拉選定值的結果

我需要設置一個簡單的列表框，在按下按鈕後在同一頁上顯示結果。例如，下面的代碼顯示了每天7天的時間列表。現在，當按下按鈕時，我會彈出一個對話框，提示「頁面位於」**。com「說：7-9」。在單擊按鈕後顯示下拉選定值的結果

如何在沒有彈出按鈕的情況下簡單地在按鈕下方顯示「7-9」？

<script> 
function displayResult() 
{ 
var x=document.getElementById("mySelect").selectedIndex; 
alert(document.getElementsByTagName("option")[x].value); 
} 
</script> 
</head> 
<body> 

<form> 
Select a day: 
<select id="mySelect"> 
    <option value="8-8">Monday</option> 
    <option value="7-9">Tuesday</option> 
    <option value="7-9">Wednesday</option> 
    <option value="7-9">Thursday</option> 
    <option value="7-10">Friday</option> 
    <option value="10-10">Saturday</option> 
    <option value="10-5">Sunday</option> 
</select> 
</form>  
<button type="button" onclick="displayResult()">Display result</button>

http://jsfiddle.net/78NKt/

來源

2013-10-31 Max Zeygelshefer

你不想警覺嗎？你想在同一頁面顯示/顯示'7-7'？ –

嘗試使用insertBefore和function.call有設置該元素本身的功能裏面的背景下，這個方式。，另外你可以得到使用element.value的選擇的值（更短）：

function displayResult() { 
     var x = document.getElementById("mySelect"); 
     this.parentNode.insertBefore(document.createTextNode(x.value), this.nextSibling); 
    }

和

<button type="button" onclick="displayResult.call(this)">Display result</button>

Demo

來源

2013-10-31 15:25:07 PSL

完美，謝謝！ –

@MaxZeygelshefer不客氣.. :) – PSL

嘿PSL，我看到結果不會刷新後第二次點擊。顯示的值只是保持相鄰的積累。 –

在單擊按鈕後顯示下拉選定值的結果

回答

相關問題