使用链接将内容添加到输入框

时间:2014-01-25 14:49:07

标签: javascript jquery dom

使用链接使用链接内容填充输入文本框的最简单方法是什么?

我有这些链接 - 很少像这些

<a href="javascript:;" title="Add Code to quick Quote Form">P3030-6</a>
<a href="javascript:;" title="Add Code to quick Quote Form">P3030-6</a>

此文本框

<input type="text" name="code" value="" size="40" class="wpcf7-form-control wpcf7-text sidebarInput" id="code" aria-invalid="false">

当有人点击链接时,我希望将P3030-6等添加到文本框中。

我有一个很棒的小脚本使用jquery 1.7,但我的网站需要1.10.2 - 并且添加1.7脚本停止了网站的一些功能。

关于最佳流程的任何想法都很受欢迎!

由于

3 个答案:

答案 0 :(得分:0)

好吧,你可以在链接上添加一个类

<a href="" class="forinput" title="Add Code to quick Quote Form">P3030-6</a>

然后像

$('.forinput').click(function(e) {
    e.preventDefault();
    $('#code').val($(this).text());
});

请参阅jsFiddle

修改

添加

$('.forinput').click(function(e) {
    e.preventDefault();
    var $code = $('code');
    $code.val($code.val() + $(this).text());
});

请参阅jsFiddle

答案 1 :(得分:0)

href="" onclick="document.getElementById('code').value=this.innerHTML;return false;"

那应该在每个链接中。或者你可以通过Javascript系统地做到这一点,但有人已经这样做了,所以我会变得不同而且跛脚。

onclick="var code = document.getElementById('code');code.value=(code.value.indexOf(this.innerHTML) < 0) ? code.value + ', ' + this.innerHTML : code.value;return false;"

答案 2 :(得分:0)

你可以做到这一点。这取决于您的锚标记位置。您可以通过其父元素获取锚标记。 (例如,我使用了以课程内容为父母的div。)

演示: http://jsfiddle.net/a6NJk/597/

<div class="content">
  <a href="javascript:;" title="Add Code to quick Quote Form">P3030-61</a>
  <a href="javascript:;" title="Add Code to quick Quote Form">P3030-62</a>

   <input type="text" name="code" value="" size="40" class="wpcf7-form-control wpcf7-text sidebarInput" id="code" aria-invalid="false">

</div>

Jquery的:

$(".content a").click(function(e){
     e.preventDefault();
     $('#code').val($(this).text());
     console.log("fddsf");
    })

如果要添加所有锚点击文本:
演示:http://jsfiddle.net/a6NJk/598/ 然后替换

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

通过

$('#code').val($('#code').val()+$(this).text());

如果您不想要重复值:

演示:http://jsfiddle.net/a6NJk/600/

$(".content a").click(function(e){
     e.preventDefault();
    var out = $('#code').val();
    if(out.indexOf($(this).text()) == -1) {
      $('#code').val(out+$(this).text());
    }
  })

您可以像这样添加,

http://jsfiddle.net/a6NJk/607/

$(".content a").click(function(e){
 e.preventDefault();
var out = $('#code').val();
if(out.indexOf($(this).text()) == -1) {
    out = out == '' ? out: out+',';
  $('#code').val(out+$(this).text());
}

})