javascript - 输入文本框后，按钮单击不再起作用

Question

我有一个文本框，我想通过键盘向其中添加文本，以及从下拉框中混合一些预定义的短语。当我第一次进入该页面时，将短语添加到文本框中没有问题，但是一旦我在按钮中输入内容就停止工作

HTML 是：

  <div class="tab-pane" id="message">
  <textarea rows="4" cols="50" id="send_message" placeholder="Enter text ...">      </textarea>
  <a href="#message" class="btn btn-large btn-info"  data-toggle="tab">Add Phrase</a>
   <label for=message_list>message_list</label><select id=message_list><option>Hi There.</option><option>How Are You?</option></select>  </div>

我的jQuery是：

$('#message').on("click", "a", function(){
.......
..........

else if( $(this).is(":contains(Add Phrase)") )  {
        $('#send_message').append($('#message_list').text());
    }
});

我怎样才能解决这个问题？

Answer 1

用于val设置textarea And的值val以访问选择值。

您试图append在表单元素上使用。

$('#send_message').append($('#message_list').text());

应该是

$('#send_message').val($('#message_list').val());

检查小提琴

$('#message').on("click", "a", function (e) {
    e.preventDefault();
    if ($(this).is(":contains(Add Phrase)")) {
        var $message = $('#send_message')
            previousText = $message.val();
        var currText = previousText + ' ' + $('#message_list').val();
        $('#send_message').val(currText);
    }
});