Question

现在，如果我点击按钮，它会清除输入字段中的所有内容，并自动输入“@marry”。
但是，我不希望它被清除:(

如果我想在输入字段中已存在的字符串末尾添加“@marry”，该怎么办？

如何自定义我的javascript部分？

输入字段

<textarea class="box text_area" cols="10" id="input" name="comment[body]"></textarea>

按钮

<a href="#topic" id="username" value="@marry”><span class='btn'>reply</span></a>

的javascript

$(document).on('click', 'a#username', function()  {
    $(".box#input").val($(this).attr('value'));
}

Answer 1

val()有一个带有参数index和value的回调函数，您可以使用它来轻松地向该值添加内容。

$(".box#input").val(function(_, val) {
    return this.value + 'some extra string';
});

$(document).on('click', 'a#username', function()  {
    var self = this;

    $(".box#input").val(function(_, val) {
        return val + self.value;
    });
});

Answer 2

首先，adeneo的答案很好，您应该阅读它。这是一个不使用jQuery的替代解决方案：

我假设这两个元素都是表单的一部分。让我们说例如表单的ID为"post"。我们可以使用document.forms然后使用其字段来访问它：

 var input = document.forms.post["comment[body]"];

现在，只要单击按钮，我们就可以添加其值。首先使用getElementById或querySelector选择username，然后添加事件：

username.addEventListener("click", function(ev){
     input.value += ev.target.value;
});

或者使用jQuery（如果元素还没有在DOM中，它也会委托）：

$(document).on('click', 'a#username', function()  {
    input.value += this.value;
});

可能需要在当前文本和用户名之间追加一个额外的空格。

Answer 3

在文本区域的末尾添加@marry。你可以使用它的工作正常代码。

$(document).on('click', 'a#username', function () {
    var txtvalue = $(".box#input").val();
    $(".box#input").val(txtvalue + $(this).attr('value'));
});

请参阅jsfiddle链接http://jsfiddle.net/F6mkh/1/

如何添加到输入字段中已存在的字符串的末尾？

3 个答案: