Question

具体来说，它与默认值（async: true）有何不同？

在什么情况下我想明确地将async设置为false，并且它是否与阻止页面上的其他事件被触发有关？

Answer 1

是否与某些事情有关阻止页面上的其他事件从解雇？

是

将async设置为false意味着您调用的语句必须在调用函数中的下一个语句之前完成。如果设置async：true，则该语句将开始执行，并且无论异步语句是否已完成，都将调用下一个语句。

有关更多信息，请参阅： jQuery ajax success anonymous function scope

Answer 2

async:false =代码已暂停。（其他代码等待为此完成。）
async:true =代码继续。（没有任何内容被暂停。其他代码不等待。）

就这么简单。

Answer 3

Async:False将执行休息代码。一旦你得到ajax的响应，只有这样，其余的代码才会执行。

Answer 4

如果禁用异步检索，则脚本将阻塞，直到请求完成为止。它以按已知顺序执行某些请求序列很有用，但我发现异步回调更清晰。

Answer 5

这

https://xhr.spec.whatwg.org/#synchronous-flag

工作人员之外的同步XMLHttpRequest正在从Web平台中删除，因为它对最终用户的体验产生了不利影响。（这是一个需要很多年的漫长过程。）当JavaScript全局环境是文档环境时，开发人员不得为async参数传递false。强烈建议用户代理在开发人员工具中警告这种用法，并尝试在发生时抛出InvalidAccessError异常。未来的方向是仅允许工作线程中的XMLHttpRequests。该消息旨在警告这一结果。

Answer 6

一个用例是在用户关闭窗口或离开页面之前进行ajax调用。这就像删除数据库中的一些临时记录，然后用户可以导航到另一个站点或关闭浏览器。

 $(window).unload(
        function(){
            $.ajax({
            url: 'your url',
            global: false,
            type: 'POST',
            data: {},
            async: false, //blocks window close
            success: function() {}
        });
    });

Answer 7

使用此选项小数：3

此处是网址：https://demos.telerik.com/kendo-ui/numerictextbox/index

<!DOCTYPE html>
<html>
<head>
    <base href="https://demos.telerik.com/kendo-ui/numerictextbox/index">
    <style>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</style>
    <title></title>
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.default-v2.min.css" />

    <script src="https://kendo.cdn.telerik.com/2019.3.1023/js/jquery.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2019.3.1023/js/kendo.all.min.js"></script>


</head>
<body>

        <div id="example">
            <div id="add-product" class="demo-section k-content">
                <p class="title">Add new product</p>
                <ul id="fieldlist">
                    <li>
                        <label>
                            Price:
                            <input id="currency" type="number" title="currency" value="30" min="0" max="100" style="width: 100%;" />
                        </label>
                    </li>
                    <li>
                        <label>
                            Price Discount:
                            <input id="percentage" value="0.05" title="percentage" style="width: 100%;" />
                        </label>
                    </li>
                    <li>
                        <label>
                            Weight:
                            <input id="custom" value="2" title="custom" style="width: 100%;" />
                        </label>
                    </li>
                    <li>
                        <label>
                            Currently in stock:
                            <input id="numeric" type="number" title="numeric" value="17" min="0" max="100" step="1" style="width: 100%;" />
                        </label>
                    </li>
                </ul>
            </div>


            <script>
                $(document).ready(function() {
                    // create NumericTextBox from input HTML element
                    $("#numeric").kendoNumericTextBox();

                    // create Curerncy NumericTextBox from input HTML element
                    $("#currency").kendoNumericTextBox({
                        format: "c",
                        decimals: 3
                    });

                    // create Percentage NumericTextBox from input HTML element
                    $("#percentage").kendoNumericTextBox({
                        format: "p0",
                        min: 0,
                        max: 0.1,
                        step: 0.01
                    });

                    // create NumericTextBox from input HTML element using custom format
                    $("#custom").kendoNumericTextBox({
                        format: "#.00 kg"
                    });
                });
            </script>

            <style>
                .demo-section {
                    padding: 0;
                }

                #add-product .title {
                    font-size: 16px;
                    color: #fff;
                    background-color: #1e88e5;
                    padding: 20px 30px;
                    margin: 0;
               }

               #fieldlist {
                   margin: 0 0 -1.5em;
                   padding: 30px;
               }

               #fieldlist li {
                   list-style: none;
                   padding-bottom: 1.5em;
               }

               #fieldlist label {
                   display: block;
                   padding-bottom: .6em;
                   font-weight: bold;
                   text-transform: uppercase;
                   font-size: 12px;
               }

               #fieldlist label .k-numerictextbox {
                   font-size: 14px;
               }
            </style>

        </div>


</body>
</html>

jQuery.ajax（）中“async：false”有什么作用？

7 个答案: