我如何獲取按鈕值以顯示在文本框中

這是我的代碼，我如何獲取按鈕值以在文本框中顯示。我試過，但沒有奏效我如何獲取按鈕值以顯示在文本框中

<p>Click the button to return the value of its value attribute.</p> 

<button id="myBtn" value="myvalue" onclick="myFunction()">Try it</button> 

<input id="demo" readonly> 


<script> 
    function myFunction() { 
    var x = document.getElementById("myBtn").value; 
    document.getElementById("demo").innerHTML = x; 
    } 
</script>

這是小提琴在那裏我嘗試了https://jsfiddle.net/mp5pndyw/

來源

2017-08-17 ebi

如果要在文本框中顯示值，則應該使用'value'而不是'innerHTML'。 – urielSilva

'document.getElementById（「demo」）。value = x'，你的'input'元素顯示的值不是HTML。而且這個小提琴的代碼與問題完全不同。 –

那麼一開始，你還沒有爲你的輸入分配一個'type'，並且輸入有'value's，並且不包含'innerHTML' ......你的jsfiddle與你的問題中的源代碼有很大不同。 – NewToJS

這是你的小提琴修改工作的一個環節。

https://jsfiddle.net/mp5pndyw/1/

var buttons = document.querySelectorAll('.dropdown-item') 
 
var textbox = document.getElementById('display') 
 

 
for (let i=0; i < buttons.length; i++) { 
 
\t buttons[i].addEventListener("click", function(e) { 
 
\t \t textbox.value = e.target.value 
 
\t }) 
 
}

<form method = "POST" action = "addprocess.php"> 
 
\t <fieldset> 
 
\t <legend align="center">Semester Courses</legend><br><br> 
 
\t <div class="row"><label style="font-family: verdana; font-size: 25px;">&emsp;&emsp;&emsp;BIOLOGY&emsp;</label> 
 
    \t <div class="col-lg-4"> 
 
    <div class="input-group"> 
 
     <input type="text" id="display" class="form-control" aria-label="Text input with dropdown button" readonly> 
 
     <div class="input-group-btn"> 
 
     <button type="button" id="dropdown0" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> 
 
      Click to Select 
 
     </button> 
 
    
 
     <div class="dropdown-menu dropdown-menu-right"> 
 
      <button type="button" class="dropdown-item" value="BIOL 8803">BIOL 8803</button> 
 
      <div role="separator" class="dropdown-divider"></div> 
 
      <button type="button" class="dropdown-item" value="BIOL 8805">BIOL 8805</button> 
 
      <div role="separator" class="dropdown-divider"></div> 
 
      <button type="button" class="dropdown-item" value="BIOL 8807">BIOL 8807</button> 
 
      <div role="separator" class="dropdown-divider"></div> 
 
      <button type="button" class="dropdown-item" option value="BIOL 8809">BIOL 8809</button> 
 
     
 
     </div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div><br><br> 
 
<input name="submit" type ="submit" value="click to submit"> 
 
<input name="reset" type ="reset" value="Reset"> 
 
</fieldset> 
 
</form>

來源

2017-08-17 00:36:29

您是否認爲指出所做的更改並解釋這些更改的原因是一個好主意，以便人們可以理解爲什麼當前源代碼不是按預期運作？ – NewToJS

感謝@Christopher Messer這工作 – ebi

@Christopher梅瑟請你可以嘗試在你的瀏覽器上運行我的代碼，我注意到我的傳奇只顯示在小提琴上，但不顯示在瀏覽器上。你有什麼想法，爲什麼它是這樣的？ – ebi

要設置文本輸入的innerHTML。相反，你需要使用value

function myFunction() { 
 
    var x = document.getElementById("myBtn").value; 
 
    document.getElementById("demo").value = x; 
 
}

<p>Click the button to return the value of its value attribute.</p> 
 

 
<button id="myBtn" value="myvalue" onclick="myFunction()">Try it</button> 
 

 
<input id="demo" readonly>

來源

2017-08-17 00:48:04 clabe45

我不知道正是爲什麼你的例子不工作，嘗試它，我一直得到一個控制檯錯誤，它違反策略時。然而，如果你只是希望它的工作，你總是可以刪除您的onclick屬性，並使用以下JavaScript：

function myFunction(e) { 
    var myInput = document.getElementById("demo") 
    myInput.value = e.srcElement.value 
} 

document.getElementById("myBtn").addEventListener("click", myFunction)

這增加了通過JavaScript監聽器（即的addEventListener ...）。然後，您可以通過事件（e）訪問您單擊的元素，並使該功能在類似情況下可重用。快樂的編碼！

來源

2017-08-17 00:57:44 Right2Drive

我如何獲取按鈕值以顯示在文本框中

回答

相關問題