Toastr Growl 在成功调用 AJAX 后未显示

Question

通过我的 JavaScript 代码，我能够收到关于格式错误的 URL 的警报，但是当成功 POST 发生时，我可以让 response.id 出现通过 alert 调用，但没有使用我用于格式错误的 URL 逻辑的相同的 toastr 咆哮。我错过了什么吗？

<link href="http://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.css" rel="stylesheet"/>
<script src="http://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.js"></script>
<script type="text/javascript">
    $(function () {
        $('#submit').click(function () {
            var txt = $('#url').val();
            var re = /(http(s)?:\)?([\w-]+\.)+[\w-]+[.com|.in|.org]+(\[\?%&=]*)?/
            if (!re.test(txt)) {
                toastr.options = {
                    "closeButton": false,
                    "debug": false,
                    "newestOnTop": false,
                    "progressBar": false,
                    "positionClass": "toast-bottom-center",
                    "preventDuplicates": false,
                    "onclick": null,
                    "showDuration": "300",
                    "hideDuration": "1000",
                    "timeOut": "5000",
                    "extendedTimeOut": "1000",
                    "showEasing": "swing",
                    "hideEasing": "linear",
                    "showMethod": "fadeIn",
                    "hideMethod": "fadeOut"
                };
                toastr["error"]("Invalid URL!");
                $('#url').val('');
                return false;
            }
            $.ajax({
                url: "{{ url_for('api.start_status') }}",
                type: 'POST',
                contentType: "application/json",
                dataType: 'json',
                data: JSON.stringify({"url": txt}),
                success: function (response) {
                    var meme = response.id;
                    toastr(meme);
                }
            });
        });
    });
</script>

更新 #1: 正如建议的那样，这是现在的代码，它仍然显示相同的行为。确认它在 SAFARI 中也不起作用，因此至少有 2 个浏览器显示相同的问题。

<link href="http://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.css" rel="stylesheet"/>
<script src="http://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.js"></script>
<script type="text/javascript">
    $(function () {
        toastr.options = {
            "closeButton": false,
            "debug": true,
            "newestOnTop": false,
            "progressBar": false,
            "positionClass": "toast-bottom-center",
            "preventDuplicates": false,
            "onclick": null,
            "showDuration": "300",
            "hideDuration": "1000",
            "timeOut": "5000",
            "extendedTimeOut": "1000",
            "showEasing": "swing",
            "hideEasing": "linear",
            "showMethod": "fadeIn",
            "hideMethod": "fadeOut"
        };
        $('#submit').click(function () {
            var txt = $('#url').val();
            var re = /(http(s)?:\)?([\w-]+\.)+[\w-]+[.com|.in|.org]+(\[\?%&=]*)?/
            if (!re.test(txt)) {

                toastr["error"]("Invalid URL!");

                $('#url').val('');
                return false;
            }
            $.ajax({
                url: "{{ url_for('api.start_status') }}",
                type: 'POST',
                contentType: "application/json",
                dataType: 'json',
                data: JSON.stringify({"url": txt}),
                success: function (response) {
                    toastr.success("Invalid URL 2!");
                    var meme = response.id;
{#                        alert(meme);#}
                }
            });
        });
    });
</script>

Answer 1

所以无论是格式错误的 url 还是成功的 ajax 调用，您都希望显示相同的 toast。

如果我理解正确，那么当我查看您的代码时，您似乎仅在 regex.test 不成功时才放置 toastr.options

为了测试，我会将选项移到 if(!re.test...)?

之外

Toastr Growl 在成功调用 AJAX 后未显示

Toastr Growl is not showing up after a successful AJAX call

javascript

python

ajax

jquery

toastr