3

我得到了这个带有标签按钮的输入框

<input id="demooutput" type="text" size="15" value="My Text" name="demo" />
<span class="demooutput">
    <a href="#" class="button orange"> A</a>
    <a href="#" class="button orange"> B</a>
    <a href="#" class="button orange"> C</a>
    <a href="#" class="button orange"> D</a>
    <a href="#" class="button orange"> E</a>        
</span>

使用此 jQuery 代码，我将值添加到输入

$('.demooutput a').click(function(){
    $('#demooutput').val($(this).html());
    return false;
});

但我每次点击按钮都会清除我现有的价值

我想将按钮中的值另外添加到输入中的现有值

示例我想要谁

My Text A (by click on A)
My Text A B (by click on A and B)
My Text B C E (by click on B, C and E)
and so on..


在JSFIDDLE 上查看演示

4

3 回答 3

6

$('#demooutput').val($('#demooutput').val() + $(this).html());

于 2013-07-28T12:37:07.870 回答
2

尝试这个：

$('.demooutput a').click(function(){
    var values = $('#demooutput').val().split(' ');
    values.push($(this).html());
    $('#demooutput').val(values.join(' '));
    return false;
});

演示

或者只是简单地：

$('.demooutput a').click(function(){
    $('#demooutput').val($('#demooutput').val() + ' '+ $(this).html());
    return false;
});

演示

但是在某些情况下建议使用第一种方法，因为它清楚地分离了逻辑。例如：如果您需要切换文本（单击“A”然后再次单击“A”以隐藏“A”，只是从数组中删除“A”并加入）

于 2013-07-28T12:37:23.703 回答
1

这不是经过测试的代码，但您正在寻找类似的东西。

$('.demooutput a').click(function(e){
    e.preventDefault(); // jQuery for return false
    var $demooutput = $('#demooutput'); // cache selector for performance
    $demooutput.val($demooutput.val()+' '+$(this).html());
});
于 2013-07-28T12:43:02.630 回答