1

我正在编写一些基于使用 jQuery 的教程的代码,$(document).ready它在页面加载(或文档准备好)后立即开始工作。该代码非常标准(根据我对 jQuery 的了解很少),并且在页面加载时确实可以工作。

$(document).ready(function () {
    // Do stuff here
});

但现在我想更改它,以便代码从函数运行。我的第一个想法是我可以将功能更改为此

$(function dothis() {
    // Do stuff here
});

然后用 dothis() 调用它;但是当我这样做时,我得到一个“dothis is not defined”错误。我也尝试了几种不同的方法,但无法弄清楚。我需要做什么才能使这项工作按我想要的方式工作?

function searchCustomers() {
    var searchvalue = document.getElementById('searchText2').value;
    var searchtype = document.getElementById('searchType2').value;

    //Just checking to make sure this part is working...
    //alert(searchtype + '  ' + searchvalue)

    // Run the "Do Stuff here"

    var showDiv = document.getElementById('divCustomerGrid');
    showDiv.style.display = 'block';
};
4

4 回答 4

5

打开它

$(function dothis() {
    // Do stuff here
});

应该

function dothis() {
    // Do stuff here
}
于 2013-06-27T16:51:57.190 回答
0

或者像这样:

var dothis = function(){
  //...
}
于 2013-06-27T16:53:31.037 回答
0

如果函数内部的代码正在操作 DOM,那么您必须确保文档已准备就绪,因此在这种情况下,您可以简单地在外部声明命名函数,然后仅在文档内部调用它准备就绪并附加所有事件处理程序从那里调用你的函数。您还应该考虑制作有关整个事件链的草稿以查看依赖关系。

于 2013-06-27T17:04:52.290 回答
0

请记住,jQuery 不是一种语言。使用 jQuery 的一切都只是 javascript,因此您创建函数的方式与创建任何其他 javascript 函数的方式相同。

如果我像这样重写您的第一个示例,它会更清楚一点:

function doStuff() {
    // Do stuff here
}
var doc = jQuery(document);
doc.ready(doStuff);

这与您编写的效果完全相同 - 我们正在定义一个函数,并将其作为文档事件的事件处理程序传入ready。因此,如果您想doStuff()从其他地方调用,您可以像任何其他功能一样进行操作。

此外,如果您尝试doStuff()稍后基于事件调用,您可以将其绑定到不同的事件,而不是文档就绪事件。例如:

$('#myBtn').click(doStuff);

这将doStuff()#myBtn单击元素时调用。在这种情况下,整行应该发生在document.ready事件内部,因此我们可以确定#myBtn元素确实存在。这可能看起来像这样:

$(document).ready(function() {
    $('#myBtn').click(doStuff);
});

但是 - 基于一些评论,我怀疑你只是想把它放在一个函数中,因为你必须这样做才能使用 jQuery。由于情况并非如此,您可以直接将 jQuery 命令放入您的searchCustomers()函数中,而不是调用函数(假设您没有从多个地方调用它)。


话虽如此,您可以在代码中进行一些不相关的优化。

  1. 将函数直接传递给jQueryor$函数是分配document.ready事件处理程序的快捷方式。因此,您可以像这样编写原始示例:

    $(function () {
        // Do stuff here
    });
    
  2. 您可以使用 jQuery 来简化您已经在searchCustomers()函数中执行的大部分操作。我会这样重写它:

    function searchCustomers() {
        var searchvalue = $('#searchText2').val();
        var searchtype = $('#searchType2').val();
    
        //Just checking to make sure this part is working...
        //alert(searchtype + '  ' + searchvalue)
    
        // Do more jQuery stuff here
    
        $('#divCustomerGrid').show();
    };
    
于 2013-06-27T17:40:00.180 回答