Question

如果有人通过单击该文本使用jquery用一些文本填充输入字段？

文本是动态生成的，因此提前不知道该值。

例如：

<input id="tag" type="text" name="tags" value="">

<p>
    <a class="tag">aaa</a><br/>
    <a class="tag">bbb</a><br/>
    <a class="tag">ccc</a><br/>
    <a class="tag">ddd</a><br/>
    <a class="tag">eee</a>
</p>

我试试这个

$('a.tag').live('click', function(e){
    $('#tag').val(this.innerHTML);
    return false; 
});

但这只会在输入字段中放置一个标记，我需要输入类似这样的内容

<input id="tag" type="text" name="tags" value="aaa, bbb, ccc, eee">

这是一个有效的例子 http://jsfiddle.net/Kaf3V/4/

Answer 1

获取当前值并添加新的：$('#tag').val( $('#tag').val() + this.innerHTML);您可能想要使用数据数组，甚至将.data（）添加到元素中以防止多次添加相同的值。

Answer 2

您可以使用css类跟踪所选链接，以便您也可以删除已添加的链接。

$('a.tag').live('click', function(e){

    // toggle selected class
    $(this).toggleClass('selected');

    // make a collection of tags
    var newTag = [];
    $('a.tag.selected').each(function(){

        // add value;
        newTag.push($(this).text());
    });
    $('#tag').val(newTag.join(', '));

    return false;  
});

有关演示，请参阅以下jsFiddle。

注意：仅当重复或点击链接的顺序不重要时才有效。

通过单击链接填充输入字段 - jQuery

2 个答案: