Question

为什么当我加载此页面时，它会自动调用函数？

我的主要观点是，当我按下按钮时，它会显示LOADING 2秒，然后开始发布到data.php

但是当我测试时，当我加载页面时，我没有按下按钮，它会自动调用函数doajax_products_check如何将代码应用于主要想法？

的index.php

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<form name="form1" id="form1id" method="post">
<input type="text" name="products_id" value="1294759">
<input type="text" name="products_color" value="red">
<input type="text" name="products_type" value="electronic">
<input type="button" value="Check" onclick="doajax_products_check()"/>
</form>
<span id="loading" style="display: none;">LOADING</span>
<p id="myplace_data"></p>
<script>
timer = setTimeout
    (
        function doajax_products_check()
            {
                $('#myplace_data').hide();
                $("#loading").fadeIn("slow");
                $.ajax
                    (
                        {
                            url: 'data.php',
                            type: 'POST',
                            data: $('#form1id').serialize(),
                            cache: false,
                            success: function(data)
                                {
                                    $("#loading").fadeOut("slow");
                                    $('#myplace_data').show();
                                    $('#myplace_data').html(data);
                                }
                        }
                    );
            }, 2000
    );
</script>

data.php

<?PHP echo "completed"; ?>

Answer 1

setTimout(callback, delay)将在delay毫秒之后调用回调函数，在您加载页面2秒后就会调用。

请改为尝试：

<script>
function doajax_products_check(){

    $('#myplace_data').hide();
    $("#loading").fadeIn("slow");    //show loading before waiting for timeout

    setTimeout(function () {
        $.ajax({
            url: 'data.php',
            type: 'POST',
            data: $('#form1id').serialize(),
            cache: false,
            success: function (data) {
                $("#loading").fadeOut("slow");
                $('#myplace_data').show();
                $('#myplace_data').html(data);
            }
        });
    }, 2000);
}
</script>

请在此处查看：http://jsfiddle.net/o5vrbqjy/1/

Answer 2

你应该这样做：

function doajax_products_check() {
    setTimeout(function(){
        $('#myplace_data').hide();
        $("#loading").fadeIn("slow");
        $.ajax
        (
            {
                url: 'data.php',
                type: 'POST',
                data: $('#form1id').serialize(),
                cache: false,
                success: function (data) {
                    $("#loading").fadeOut("slow");
                    $('#myplace_data').show();
                    $('#myplace_data').html(data);
                }
            }
        )
    }, 2000);
}

这是追加的，因为setTimeout调用了doajax_products_check（）函数...

Answer 3

加载页面后会直接解析您的脚本片段，因此会立即设置超时。必须在onclick-callback中设置超时。您可以使用

实现所需的行为

<script>
function doajax_products_check() {
  setTimeout(function(){
    // Your logic for the check goes here
  }, 2000);
}
</script>

为什么当我加载这个页面时，它会自动调用功能？

3 个答案: