javascript - JavaScript触发器不起作用

我尝试触发一个按钮，以便当用户加载页面时，该按钮会自动单击。

我的代码如下：

$(document).ready(function() {
  console.log("it's here");

  $("#btnPeriod").trigger('click');
});

$("#btnPeriod").on('click', function(){
  var ahhhhh = "<security:authentication property="securityUser.fullName"/>";
  ahhhhh = ahhhhh.replace(/&#32;/g, " ");
  console.log(ahhhhh);

  $.extend($("#noticeList").jqGrid("getGridParam", "postData"),{
    filters : JSON.stringify({
      groupOp : "OR",
      rules : [{
        field : "notiWriter",
        op : "eq",
        data : ahhhhh
      }],
      groups : []
    })
  });
  $("#noticeList").jqGrid("setGridParam", {search : true}).trigger('reloadGrid', [{current : true, page : 1}]);
});

加载页面后，我会看到“它在这里”的日志和ahhhhh的值。但是，即使我可以看到日志，也不会应用假定发生的操作。有趣的是，当我单击该按钮时，它又与变量ahhhhh的另一条日志消息一起起作用。

仅供参考，我使用的是jqGrid，当我单击btnPeriod按钮时，它将过滤其notiWriter的单元值与变量ahhhhh不匹配的行。

现在，当我加载此页面时，它显示如下：


然后，当我单击一个按钮时，它仅显示某些行，如下所示：


我希望当用户加载页面时，它总是看起来像第二张图片。

我曾经使用过setTimeout，但事实证明它不能很好地工作，所以希望您能对我有所帮助。

先感谢您。

最佳答案

您需要在单击trigger()之前，将click处理程序绑定到document.ready处理程序内的按钮。尝试这个：

$(document).ready(function() {
    $("#btnPeriod").on('click', function(){
        var ahhhhh = "<security:authentication property="securityUser.fullName"/>";
        ahhhhh = ahhhhh.replace(/&#32;/g, " ");
        console.log(ahhhhh);

        $.extend($("#noticeList").jqGrid("getGridParam", "postData"),{
            filters : JSON.stringify({
                groupOp : "OR",
                rules : [{
                    field : "notiWriter",
                    op : "eq",
                    data : ahhhhh
                }],
                groups : []
            })
        });

        $("#noticeList").jqGrid("setGridParam", {
            search: true
        }).trigger('reloadGrid', [{
            current: true,
            page: 1
        }]);
    });

    $("#btnPeriod").trigger('click');
});