单击时向输入字段添加值答案

【问题标题】：Adding value to an Input field on click单击时向输入字段添加值
【发布时间】：2010-04-08 11:11:07
【问题描述】：

我在表单上有这个结构，

<input type="test" value="" id="username" />

<span class="input-value">John Smith</span>

<a href="#" class="fill-input">Fill Input</a>

当用户点击填充输入时，

span 中具有 input-value 类的数据将被添加到 value 中，单击标签后代码应如下所示，

 <input type="test" value="john Smith" id="username" />

    <span class="input-value">John Smith</span>

    <a href="#" class="fill-input">Fill Input</a>

单个页面上有许多表单元素/输入。

【问题讨论】：

标签： javascript jquery html css jquery-plugins

【解决方案1】：

你可以这样做：

$('a.fill-input').click(function() {
   $(this).prevAll("input:first").val($(this).prev(".input-value").text());
});

这不是只查找类，而是在您单击的按钮之前查找范围和输入...这意味着无论您在页面上有多少此类，它都可以工作。

与您的示例不同，该值将是John Smith，与跨度中的大小写相同，如果您确实想要小写，请将.text() 更改为.text().toLowerCase()。

【讨论】：

【解决方案2】：

$('a.fill-input').click(function() {
    $('#username').val($('.input-value.').text());
});

【讨论】：

需要说这是jQuery代码。在jquery.com 获取 jQuery。从docs.jquery.com/Downloading_jQuery 开始。 jQuery 文档位于api.jquery.com。编辑：由于这被标记为 jQuery，作者可能知道 jQuery，但我让信息持续存在。
问题被标记为 jQuery。毫无意义的评论。

【解决方案3】：

这应该足以满足您如此结构化的所有输入。它不依赖于元素的名称。请注意，prevAll 以相反的顺序返回元素，因此您需要查找第一个输入，而不是前面输入中的最后一个。

$('.fill-input').click( function() {
    var $input = $(this).prevAll('input[type=test]:first');
    var $value = $(this).prev('span.input-value');
    $input.val($value.text());
});

【讨论】：

【解决方案4】：

尝试：

$('a.fill-input').click(function(e){
  $('#username').val($('span.input-value').text());
   e.preventDefault();
   return false;
});

【讨论】：