Question

很抱歉，我经常在这里发帖 - 我做了很多工作，反过来遇到了很多问题。

click处理程序只修改了一些全局变量并将这些变量发送出来以通过Ajax更新页面。这是我的Javascript :(请注意，getPosts函数正在运行，但可能没有在.click（）上调用。

如果你想查看肉体文件，请访问www.ethoma.com/testhome.php，php访问www.ethoma.com/getposts.php。

var category = "undefined";
var page = 0;
var order="id";

function getPosts(){
            var queryString = "category=" + category + "&page=" + page + "&order=" + order;
            $.ajax({
                url: 'getposts.php',
                data: queryString,
                success: function(data) {
                $('#postcontainer').html(data);
                 }
            });
        }
$(document).ready(function() {
            getPosts();
         });

         setTimeout(getPosts(), 20000);

         $("#all").click(function(){
                category = "etc.";
                getPosts(); 
            });

Answer 1

您的点击事件超出$(document).ready，因此如果在加载元素#all之前运行javascript，则不会附加点击。将所有代码包装在ready事件

中是一种很好的做法

$(document).ready(function() {

    var category = "undefined";
    var page = 0;
    var order = "id";

    function getPosts() {
        var queryString = "category=" + category + "&page=" + page + "&order=" + order;
        $.ajax({
            url: 'getposts.php',
            data: queryString,
            success: function(data) {
                $('#postcontainer').html(data);
            }
        });
    }

    getPosts();

    setTimeout(getPosts(), 20000);

    $("#all").click(function() {
        category = "etc.";
        getPosts();
    });
});

或者，您可以使用live函数将事件绑定到所有匹配元素，无论它们是在执行过程中现在还是稍后出现。只需将$("#all").click(function更改为$("#all").live('click', function

即可

Answer 2

把这段代码：

    $("#all").click(function(){
            category = "etc.";
            getPosts(); 
        });

在$(document).ready函数内部

，以便在页面加载并且对象#all存在后安装单击处理程序。

您也可以按照mplungjan的说法修复setTimeout的来电。

至于编程风格，在全局变量中将参数传递给getPosts()是不好的形式。为什么不直接将类别名称传递给getPosts("etc.")函数并完全避免使用全局类别变量？

Answer 3

您的点击是在document.ready

之外分配的

我愿意

$(document).ready(function() {
  getPosts();
  setTimeout(getPosts, 20000); // notice I removed the ()

  $("#all").click(function(){
    category = "etc.";
    getPosts(); 
  });

});

Firefox控制台甚至会告诉您其中一个错误，除非是以非常w3schools的方式;）

错误：无用的setTimeout调用（参数周围缺少引号？）
源文件：http://www.ethoma.com/testhome.php行：39

Answer 4

把这个：

 $("#all").click(function(){
            category = "etc.";
            getPosts(); 
        });

...在您的文档就绪功能中。此外，您不希望在调用设置超时时调用getPosts，只需传递getPosts（无括号）。

Answer 5

$(function(){

        getPosts();


        setTimeout(function(){getPosts();}, 20000);

        $("#all").click(function(){
              category = "etc.";
              getPosts(); 
        });
});

把它放入document.ready event：）

这个JQuery事件处理程序有什么问题？

5 个答案: