使用javascript顯示從下拉列表中選擇一個選項到一個框中使用javascript

Question

嘿我有一個表單中的工作下降列表（使用JavaScript），並希望顯示所選選項（貓）的輸出到一個框作爲ID。

cat和id都在同一個表（內核）中。

有人能幫我嗎？

<form action="dropdown.php" method="POST"> 
    <?php 
    $sth = $dbhandle->prepare("SELECT cat FROM kernel"); 
    $sth->execute(); 
    $results = $sth->fetchAll(PDO::FETCH_ASSOC); 
    echo "<select name='cat'>"; 
    foreach($results as $row) { 
     echo "<option value='" . $row['cat'] . "'>" . $row['cat'] . "</option>"; 
    }  
    echo "</select>"; 
    ?> 
</form> 

Answer 1

你需要掛接到onChange事件select箱

HTML：

<form action="dropdown.php" method="POST"> 
    <select name='cat' id="cat_select" onChange="outputValue(this)"> 
    <option value='cat1'>cat1</option> 
    <option value='cat2'>cat2</option> 
    <option value='cat3'>cat3</option> 
    <option value='cat4'>cat4</option> 
    </select> 
</form> 
<div id="output"></div> 

JS：

function outputValue(item){ 
    document.getElementById('output').innerHTML = item.value; 
} 

http://jsfiddle.net/X663R/

編輯：下面是PHP代碼包含

<form action="dropdown.php" method="POST"> 
    <?php 
    $sth = $dbhandle->prepare("SELECT cat FROM kernel"); 
    $sth->execute(); 
    $results = $sth->fetchAll(PDO::FETCH_ASSOC); 
    echo "<select name='cat' id='cat_select' onChange='outputValue(this)'>"; 
    foreach($results as $row) { 
     echo "<option value='" . $row['cat'] . "'>" . $row['cat'] . "</option>"; 
    }  
    echo "</select>"; 
    echo "<input type='text' id='output' name='output' />"; 
    ?> 
</form> 
<script> 
function outputValue(item){ 
    document.getElementById('output').value = item.value; 
} 
</script>