动态添加输入框文本

Question

我有一个脚本，我想在按下 shift+enter 时添加 Return，单次 Enter 时它工作正常，但它没有添加 shift+Enter 和 \n，因为javascript 的错误是没有选择准确的内容。我收到以下错误

Uncaught TypeError: Cannot read property 'substring' of undefined
    at HTMLFormElement.<anonymous> (86:206)
    at HTMLFormElement.dispatch (jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js?body=1:5227)
    at HTMLFormElement.elemData.handle (jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js?body=1:4879)

这是我的代码

$(document).ready(function(){
  $('.new_message').keyup(function (event) {
  if (event.keyCode === 13 && !event.shiftKey) {
    event.preventDefault();
      var values = $(this).serializeArray();
      App.conversation.speak(values);
      $(this).trigger('reset');
  } else {
    if(event.keyCode === 13 && event.shiftKey){
      var content = $(this).serializeArray();
      var caret = getCaret($(this));
      this.value = content.substring(0, caret - 1) + "\n" + content.substring(caret, content.length);
    }
  }
  });
});

我只想在用户按下 shift+enter 时添加回车，如果他按正常回车，它工作正常并发送短信。我正在使用 rails 和套接字向用户发送聊天消息。

Answer 1

Uncaught TypeError: Cannot read property 'substring' of undefined

此错误意味着您正在对不存在的变量调用函数 substring。在您的情况下，它是 else 语句中的变量 content 。确保此变量存在并且可以在该函数的范围内访问。

[编辑]

既然您已经更新了代码并将变量 values 更改为 content，我不相信您会遇到同样的错误。请检查您的代码并更新问题以反映应用程序的实际状态。

Answer 2

  var content = $(this).serializeArray();
  var caret = getCaret($(this));
  this.value = content.substring(0, caret - 1) + "\n" + content.substring(caret, content.length);

要获取触发事件的文本区域的值，请使用 this.value（就像您在我引用的第三行中所做的那样）。

serializeArray() 用于创建一个包含表单中所有数据的数组。它不会 return 一个字符串，所以你的 return 值不会有 substring 方法。

Answer 3

问题是我正在使用 .new_message 表单选择器，虽然它正在获取价值，但它现在允许我使用 substring 方法。现在我已经通过向 message_box 添加另一个 id 并将代码更改为以下内容来进行更改。

$(document).ready(function(){
  $('.new_message').on('keyup', function(event) {
  if (event.keyCode === 13 && !event.shiftKey) {
    event.preventDefault();
      var values = $(this).serializeArray();
      App.conversation.speak(values);
      $(this).trigger('reset');
  } else {
    if(event.keyCode === 13 && event.shiftKey){
      var content = $('#message_box').val()
      var caret = getCaret(this);
      $('#message_box').val( content.substring(0, caret - 1) + "\n" + content.substring(caret, content.length) );
    }
  }
  });
});

它起作用了，但我注意到它添加了两个 Returns 并且它是开始的，所以现在我删除了第二个条件并且它工作得很好。感谢您的支持。

动态添加输入框文本

Adding enter in inputarea text dynamically

javascript

jquery

actioncable