Question

我正在尝试通过多个按钮将多个字符串添加到输入字段。问题是，每次我点击一个新按钮它都会替换/覆盖前面的插入，所以我不能添加仅替换的字符串。

如果重新点击相同的按钮，还要删除字符串

请参阅下面的代码并提琴 - http://jsfiddle.net/2khzX/

 <input type="text" id="text" style="width: 450px;" />
 <br />
 <button>Hello</button>
 <button>Yes</button>
 <button>No</button>
 <button>Maybe</button>

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js">    </script>
 <script>
  $("button").on('click', function() {
    var text = $(this).text();
    $("input").val(text + ',');
  });
 </script>

Answer 1

首先，从现有输入中获取值。

然后检查当前文本是否已存在。如果是这样，请摆脱它。

然后将当前文本追加到最后。

$("button").on('click', function() {
    var text = $(this).text() +',';
    $('input').val(function(_, val) {
        if (val.match(text)) {
            return val.replace(text, '');
        }
        return val + text;
    });
});

<强> jsFiddle

Answer 2

添加输入中已有的值，否则它只是用新值替换那里的值

$("button").on('click', function() {
    var text = $(this).text();

    $("input").val(function(_, val) {
        var arr = val.split(','),
            pos = $.inArray(text, arr);

        pos != -1 ? arr.splice(pos, 1) : arr.push(text);

        return arr.filter(function(n) {
            return n.trim().length
        }).join(',');
    });
});

FIDDLE

通过多个按钮将多个字符串添加到输入字段中

2 个答案: