Question

我想编写更清晰，更易读的代码，因此我希望在单独的文件中实现我的jQuery代码。我将文件保存在sam文件夹中，作为我从jquery.com下载的jQuery代码。在我的HTML中，我将引用放在那里，它不起作用，但如果我将jQuery代码留在我的HTML中，它就可以工作。

我的HTML代码是：

<!doctype html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>focusin demo</title>
    </head>

    <body>
        <input type="text" />
        <script type="text/javascript" src="js/jquery.js"></script>
        <script type="text/javascript" src="js/test.js"></script>
    </body>
</html>

我的jQuery代码位于一个名为test.js的单独文件中，如下所示：

$(':text').focusin(function() {
    $(this).css('background-color', 'yellow');
});

但是当我在浏览器中运行它时，它不起作用。我基本上尝试了一切，并决定需要专业的帮助。

Answer 1

您可能遇到相关链接问题。尝试更改此

<script type="text/javascript" src="js/jquery.js"></script>

到此：

<script type="text/javascript" src="/js/jquery.js"></script>

Answer 2

您需要将代码放在$（function（）{...}）;

中

像这样：

$(function() {
    $(':text').focusin(function() {
        $(this).css('background-color','yellow');
    });
});

Answer 3

您可以通过将alert()函数放在test.js文件中来确认包含文件。如果包含，那么你可以尝试在test.js文件中编写一些jQuery代码来检查jQuery文件是否正确包含。</ p>

Answer 4

您需要为jQuery脚本添加就绪处理程序，例如

$(function() {
    $('input[type=text]').focusin(function() {
        $(this).css('background-color','yellow');
    });
});

我想将我的jQuery文件与我的HTML分开添加

4 个答案: