首页 > 解决方案 > 将 onclick 按钮添加到 textarea 中的 onkeyup 函数

问题描述

function sendMessage(e){

    if (e.which == 13 && ! e.shiftKey) {
        var id = $('#form-message-write input').val();
        var message = $('#form-message-write textarea').val();

        if (message.trim() != '') {
            var data = new FormData();
            data.append('id', id);
            data.append('message', message);

            $.ajax({
                url: BASE_URL + '/direct-messages/send',
                type: "POST",
                timeout: 5000,
                data: data,
                contentType: false,
                cache: false,
                processData: false,
                headers: {'X-CSRF-TOKEN': CSRF},
                success: function (response) {
                    if (response.code == 200) {
                        $('.dm .chat .message-list .alert').remove();
                        $('#form-message-write textarea').val("");
                        $('.dm .chat .message-list').append(response.html);
                        $(".dm .chat .message-list").animate({ scrollTop: $('.dm .chat .message-list').prop("scrollHeight")}, 1000);
                    } else {
                        $('#errorMessageModal').modal('show');
                        $('#errorMessageModal #errors').html('Something went wrong!');
                    }
                },
                error: function () {
                    $('#errorMessageModal').modal('show');
                    $('#errorMessageModal #errors').html('Something went wrong!');
                }
            });
        }
        return false;
    }
}
 <div id="message_write_box" class="message-write">
   <form id="form-message-write">
     <input type="hidden" name="user_id" value="{{ $friend->id }}">
       @if ($can_send_message)

        <textarea id="personal_message" class="form-control" rows="1" placeholder="Your message.." onkeyup="sendMessage(event)"></textarea>

       @else

        <div class="alert alert-danter">You must follow each other to send messages!</div>
      @endif
   </form>
 </div>

大家好,我一直在尝试使用这段代码,而 Javascript 对我来说是一个新世界。谁能帮我理解如何将此 onkeyup 转换为 onclick 事件?感谢您的任何帮助!我只需要帮助来了解缺少什么?也许我需要添加一个事件监听器?我尝试了一些不同的东西,但我无法让按钮起作用。我确信解决方案很简单,我只需要获取 textarea 中的文本并应用一个按钮来发送用户输入。

尝试过按钮,尝试过输入字段,尝试过事件监听器,但我仍然明显做错了什么。

整个功能与 onkeyup 一样完美。

标签: javascriptjquerybuttononclickonkeyup

解决方案


首先,将按钮元素添加到 HTML。对于此按钮,可以使用 sendMessage(event) 函数添加 onclick 属性,或者添加事件侦听器并将其附加到该按钮并在侦听器中调用 sendMessage(event) 函数。

其次,您需要删除检查按键(向上)的“if (e.which == 13 && ! e.shiftKey) {”条件。由于您想在单击时触发 sendMessage 功能,因此您可能根本不需要此条件,因此您可以将其删除。其余代码应该按原样工作。


推荐阅读