Question

我有一个带按钮的页面。当按下按钮时，进行AJAX调用，然后该调用的html替换主页上的div容器。我有需要在第二页上加载的脚本。所以我担心的是，当第二页的脚本运行时，它会在控制台中给出一个“对象＃没有方法'找''错误。我知道这是脚本无法调用JQuery函数的问题。有没有人知道如何在生成第二页后调用JQuery函数？以下是我的页面所做的示例：

主页：

<html>
<head>
<script type="text/javascript">
$(document).ready({
    $('body').on('click', '.button', function() {
        $.ajax({
            type: 'GET',
            url: 'page.php'
            data { ... },
            success: function(e){
                $('#container').html(e);
            }
        });
    });
});
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
</head>
<body>
<button class="button" value="Click me!"></button>
<div id="container">
</div>
</body>
</html>

page.php文件：

echo '<div id="dropbox">';
echo '  <div class="message">Drop files here</i></div>';
echo '</div>';
echo '<script src="js/filedrop.js"></script>';
echo '<script src="js/upload.js"></script>';

然后当从第二页执行脚本时，我得到＆lt;对象＃没有方法'find'＆gt;错误。如果我在主页面上包含脚本，则脚本中的任何内容都不起作用。任何人都知道在哪里指出我正确的方向让所有这些工作？

编辑**

很抱歉让你们迷惑。我放的代码只是我快速拼凑的东西。按钮单击代码将位于document.ready中，但是从第二个脚本调用的其他函数不在document.ready中。他们是否需要在document.ready回调中让他们识别JQuery函数？

编辑2 **

感谢您澄清您可以拥有多个Document.Readys。我将在10分钟窗口结束后选择答案。

Answer 1

您的脚本标记顺序错误。您必须在使用之前加载jQuery。此外，将所有与DOM交互的代码放在$(document).ready()回调中：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('body').on('click', '.button', function() {
            $.ajax({
                type: 'GET',
                url: 'page.php'
                data { ... },
                success: function(e){
                    $('#container').html(e);
                }
            });
        });
    });
</script>

Answer 2

将您的代码放入

$(document).ready(function() {
  // your code  
  $('body').on('click', '.button', function() {
     $.ajax({
        type: 'GET',
        url: 'page.php'
        data { ... },
        success: function(e){
            $('#container').html(e);
        }
    });
  });
});

document.ready 表示已加载页面或创建文件 myscript.js ，在该文件中将所有代码包装在document.ready和

中

echo '<script src="js/myscript.js"></script>';

如何在加载页面后调用JQuery函数？

2 个答案: