AJAX内容类型问题 - AJAX content type issue?

我有一个这样的表单（别管laravel语法）

       <form action="{{ URL::route('user-refresh-message') }}" method="post" id="form-user-refresh-message">
            <input id="getterid" name="getterid" type="hidden" value="{{ $profile->user_id }}">
            <input id="getter" name="getter" type="hidden" value="{{ $profile->user->username }}">
            <button type="submit">Refresh</button>
        {{ Form::token() }}
        </form>

当我把我的代码放在submit事件的表单闭包中时，，，一切都很好

$('#form-user-refresh-message').on('submit', function(){
                $.post(
                    $(this).prop('action'),{
                        "_token": $( this ).find( 'input[name=_token]' ).val(),
                        "getterid": $( '#getterid' ).val(),
                        "getter": $( '#getter' ).val()
                    },
                    function(data){
                        $(".message-area").empty();
                        $.each(data, function(i, item) {
                            $(".message-area").append(
                            '<div class="message-item">' +
                            '<div class="message-user">' + item.who + ' said:</div>' +
                            '<div class="message-sent">' + item.when + '</div>' +
                            '<div class="message-viewed"></div>' +
                            '<div class="clearfix"></div>' +
                            '<div class="message-text seen-' + item.seen + '">' + item.text + '</div>' +
                            '</div>');
                        })
                        $('.message-area').scrollTop($('.message-area')[0].scrollHeight);
                    },
                    'json'
                ); 
                return false; 
form );

如果我把AJAX放在一个函数中，并像这样调用

            function refresh_messages() {
                $.post(
                    $(this).prop('action'),{
                        "_token": $( this ).find( 'input[name=_token]' ).val(),
                        "getterid": $( '#getterid' ).val(),
                        "getter": $( '#getter' ).val()
                    },
                    function(data){
                        $(".message-area").empty();
                        $.each(data, function(i, item) {
                            $(".message-area").append(
                            '<div class="message-item">' +
                            '<div class="message-user">' + item.who + ' said:</div>' +
                            '<div class="message-sent">' + item.when + '</div>' +
                            '<div class="message-viewed"></div>' +
                            '<div class="clearfix"></div>' +
                            '<div class="message-text seen-' + item.seen + '">' + item.text + '</div>' +
                            '</div>');
                        })
                        $('.message-area').scrollTop($('.message-area')[0].scrollHeight);
                    },
                    'json'
                ); 
                return false;                    
            }

            $('#form-user-refresh-message').on('submit', function(){
                    refresh_messages();
            });

我在控制台日志中得到了这个

未声明纯文本文档的字符编码。该文档将在某些浏览器中呈现为乱码文本如果文档包含来自US-ASCII系列。文件的字符编码需要在传输协议或文件中声明的需要使用字节顺序标记作为编码签名。

并且我在表单操作路由上被请求返回的数据的输出所困扰。

如何在AJAX请求中设置字符编码以正常工作？

我不认为这是编码问题，而是javascript范围问题。

在代码的ajax版本中，$(this).prop('action')是无效的，或者更确切地说，它不存在于该上下文中。因此，您的ajax请求被发送到一个不存在的url，结果404未找到页面的代码被加载为json响应（如果不是），您会收到错误。

因此，要解决此问题，请尝试以下操作：

function refresh_messages(targetForm) {
    $.post(
        $(targetForm).prop('action'),{
            "_token": $(targetForm).find( 'input[name=_token]' ).val(),
            "getterid": $( '#getterid' ).val(),
            "getter": $( '#getter' ).val()
        },
        function(data){
            $(".message-area").empty();
            $.each(data, function(i, item) {
                $(".message-area").append(
                '<div class="message-item">' +
                '<div class="message-user">' + item.who + ' said:</div>' +
                '<div class="message-sent">' + item.when + '</div>' +
                '<div class="message-viewed"></div>' +
                '<div class="clearfix"></div>' +
                '<div class="message-text seen-' + item.seen + '">' + item.text + '</div>' +
                '</div>');
            })
            $('.message-area').scrollTop($('.message-area')[0].scrollHeight);
        },
        'json'
    ); 
    return false;                    
}

$('#form-user-refresh-message').on('submit', function() {
    refresh_messages($(this));
});