在按鈕上單擊復制a <p> 文本到輸入框

Question

我有一個這樣的文字：

<p>01A001-Z03-71021</p>

我有這個按鈕：

<a href="#" class="btn btn-secondary2">Add to Cart</a>

我有這個輸入框：

<input class="" placeholder="" data-role="tagsinput" id="cart" value="">

當我按下按鈕時，如何使用JS復制輸入框中的文本。

謝謝。

Answer 1

<script>
  var handler = function(event) {
    document.getElementById('cart').value = event.target.innerText;
  }
</script>

<a href="#" class="btn btn-secondary2" onclick="handler(event)">Add to Cart</a>
<input class="" placeholder="" data-role="tagsinput" id="cart" value="">

Answer 2

• 這是一個使用你的HTML代碼的JsFiddle （僅限）

    $(document).on("click",".btn-secondary2",function(event){ $("input").val($("p").text()); }); 

• 這是一個JsFiddle ，我在元素上設置ID以進行正確的調用

Answer 3

您可以使用javascript的onclick和innerHtml函數。

HTML

<p id='textValue'>01A001-Z03-71021</p>
<a href="#" class="btn btn-secondary2" onclick="copyValue()">Add to Cart</a>
<input id='mytext' class="" placeholder="" data-role="tagsinput" id="cart" value="">

JS

function copyValue() {
    var valueToCopy = document.getElementById("textValue").innerHTML";
    var elem = document.getElementById("mytext");
    elem.value = valueToCopy;
}

Answer 4

您需要為段落和按鈕分配唯一ID以使用此方法。 這是jsFiddle http://jsfiddle.net/yenvpkv6/

function getText() {
    var inp = document.getElementById("text").innerHTML;
    document.getElementById("cart").value = inp;
}

document.getElementById("button").addEventListener("click", function() {
    console.log("run");
    getText();

});

Answer 5

或嘗試這樣的事情（使用addEventListener函數）：

var element = document.getElementById('button');
element.addEventListener('click', function() {
    var paragraph = document.getElementById("paragraph")
    ,   cart      = document.getElementById("cart");
    cart.value = paragraph.innerHTML;
});

http://jsfiddle.net/totw2L6j/