jQuery 如何使用带有 jQuery 的锚点设置文本框的值?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/295095/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How do I set a textbox's value using an anchor with jQuery?
提问by Kevin Pang
I have a textbox whose value I want to set based on the inner text of an anchor tag. In other words, when someone clicks on this anchor:
我有一个文本框,我想根据锚标记的内部文本设置其值。换句话说,当有人点击这个锚点时:
<a href="javascript:void();" class="clickable">Blah</a>
I want my textbox to populate with the text "Blah". Here is the code I am currently using:
我希望我的文本框填充文本“废话”。这是我目前使用的代码:
<script type="text/javascript">
$(document).ready(function(){
$("a.clickable").click(function(event){
$("input#textbox").val($(this).html());
});
});
</script>
And in my html there is a list of anchor tags with the class "clickable" and one textbox with the id "textbox".
在我的 html 中,有一个带有“可点击”类的锚标记列表和一个带有“文本框”ID 的文本框。
I've substituted the code above with code to just show a javascript alert with $(this).html() and it seems to show the correct value. I have also changed the $(this).html() to be a hardcoded string and it setes the textbox value correctly. But when I combine them the textbox simply clears out. What am I doing wrong?
我用代码替换了上面的代码,只显示一个带有 $(this).html() 的 javascript 警报,它似乎显示了正确的值。我还将 $(this).html() 更改为硬编码字符串,并正确设置文本框值。但是当我将它们组合起来时,文本框就会简单地清除掉。我究竟做错了什么?
回答by Falco Foxburr
I wrote this code snippet and it works fine:
我写了这个代码片段,它工作正常:
<a href="#" class="clickable">Blah</a>
<input id="textbox">
<script type="text/javascript">
$(document).ready(function(){
$("a.clickable").click(function(event){
event.preventDefault();
$("input#textbox").val($(this).html());
});
});
</script>
Maybe you forgot to give a class name "clickable" to your links?
也许你忘了给你的链接一个“可点击”的类名?
回答by max
To assign value of a text box whose id is ёtextboxё in jQuery please do the following
要在jQuery中分配id为ёtextboxё的文本框的值,请执行以下操作
$("#textbox").val('Blah');
回答by redsquare
Just to note that prefixing the tagName in a selector is slower than just using the id. In your case jQuery will get all the inputs rather than just using the getElementById. Just use $('#textbox')
请注意,在选择器中添加 tagName 前缀比仅使用 id 慢。在您的情况下,jQuery 将获取所有输入,而不仅仅是使用 getElementById。只需使用 $('#textbox')
回答by redsquare
To assign value of a text box whose id is "textbox" in JQuery please do the following
要在 JQuery 中分配 id 为“textbox”的文本框的值,请执行以下操作
$("#textbox").get(0).value = "blah"
$("#textbox").get(0).value = "blah"
回答by Falco Foxburr
Following redsquare: You should not use in href attribute javascript code like "javascript:void();" - it is wrong. Better use for example href="#" and then in Your event handler as a last command: "return false;". And even better - use in href correct link - if user have javascript disabled, web browser follows the link - in this case Your webpage should reload with input filled with value of that link.
遵循 redsquare:你不应该在 href 属性中使用像“javascript:void();”这样的 javascript 代码 - 这是错误的。更好地使用例如 href="#" 然后在您的事件处理程序中作为最后一个命令:“return false;”。甚至更好 - 在 href 正确链接中使用 - 如果用户禁用了 javascript,Web 浏览器会跟随该链接 - 在这种情况下,您的网页应该使用填充了该链接值的输入重新加载。