Question

假设我有一个带有列表的div和一个form input

<ul>
    <li>What is my name</li>
</ul>

<input type="text" value="" id="form">

我希望当我点击li标记时，li的内容“我的名字”会转移到input value并JavaScript < / p>

以下是我的尝试。

$('li').click(function(){
  $('#from').val() = $('li').innerHTML();
});

但这似乎不起作用。请问出路是什么？

Answer 1

您需要将值传递给val 构造函数。

$('#from').val($(this).text());

$('li').click(function(){
  $('#form').val($(this).text());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
    <li>What is my name</li>
</ul>

<input type="text" value="" id="form">

Answer 2

将li的文本作为参数传递给val()函数：

$('li').click(function() {
  $('#form').val($(this).text());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li>What is my name</li>
</ul>

<input type="text" value="" id="form">

Answer 3

您没有以正确的方式使用val()方法。它必须像这样使用：

$('#from').val($('li').innerHTML());

无论如何......如果您有多个li，则您接受的答案将无效。

您必须使用this关键字来获取您点击的li的内容。

以下是解释该内容的摘要：

$('li').click(function() {
  $('#form1').val($('li').text()); // Not correct, in my opinion
});

$('li').click(function() {
  $('#form2').val($(this).text()); // Correct, in my opinion!
});

<script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous"></script>

<ul>
  <li>Name 1</li>
  <li>Name 2</li>
  <li>Name 3</li>
</ul>

<input type="text" value="" id="form1">
<span>With $('li'), it takes the value of all the list-items</span>
<br>
<input type="text" value="" id="form2">
<span>With $(this), it takes only the value of the list-item you clicked</span>

有关.val()的文档：http://api.jquery.com/val/

希望它有所帮助。

Answer 4

尝试以下代码：

$('li').click(function(){
$('#form').val($('li')[0].innerHTML);
});

Answer 5

尝试

<script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="crossorigin="anonymous"></script>

<ul><li>What is my name</li></ul>

<input type="text" value="" id="form">

<script type="text/javascript">
$(document).ready(function() {
$('li').click(function() {
    $('#form').val($('li').text());
});
});
</script>

如何将li中的内容附加到表格inout值javascript中

5 个答案: