将 href 文本传输到文本框

Question

这是我目前的代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Test Page</title>
</head>
<body>
    <a href="">Active</a>
    <a href="">Inactive</a>
    <a href="">Banned</a>
    <input type="text">
</body>
</html>

我想做的是当我点击active时，文本框会出现active等字样。有办法吗？

Answer 1

您可以使用 jquery:

$(document).ready(function() {
    $('a').click(function(e) {
        e.preventDefault();
        var text = $(this).text();
        $('input[type=text]').val(text);
    });
});

Answer 2

没有 JQuery 以防万一有人需要它： http://jsfiddle.net/s0ds5rdy/

我建议在 href 属性中加入“#”。如果您不这样做，它将滚动到页面顶部 preventDefault，而如果您单击空白 link，浏览器可能会重新加载页面 link。

window.addEventListener("load", function () {
    var allLinks = document.getElementsByTagName("a");
    for (var i = 0; i < allLinks.length; ++i) {
        allLinks[i].addEventListener("click", function (e) {
            e.preventDefault();
            document.querySelector('input[type=text]').value = e.target.innerHTML;
        });
    }
});

Answer 3

在纯 javascript 中，您可以这样做：

html - 我建议在输入中添加一个 id

<body> <a href="#">Active</a> <a href="#">Inactive</a> <a href="#">Banned</a> <input id="foo" type="text"> </body>

javascript

var links = document.querySelectorAll( 'a' );
var input = document.getElementById('foo');

function setInput(event) {
    event.preventDefault();
    input.value = event.target.innerHTML;
};

for( var i=links.length; i--; ) {
  links[i].addEventListener( 'click', setInput, false );
};

将 href 文本传输到文本框

Transfer href text to textbox

javascript

php

jquery

html - 我建议在输入中添加一个 id

javascript