Jquery UI似乎没有加载

Jquery UI doesn't seem to be loading

本文关键字:加载 UI Jquery      更新时间:2023-09-26

>我有一个网站,它已经使用背景颜色动画一段时间了,突然间它们停止工作了。我想不出我所做的任何重大改变会导致它。所以我创建了一个文件夹来测试我的jquery.min.js和jquery.ui.js文件。这是代码:

索引.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/testing.css" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Template 3</title>
</head>
<body>
<?php
    include('parts/welcomeSection.php');
?>
</body>
<script type="text/javascript" src="js/animate.js"></script>
</html>

测试.css

@charset "utf-8";
/* CSS Document */
div#testing{
    width: 100px;
    height: 100px;
    border: 1px solid black;    
}

欢迎部分.php

<div id="testing">
</div>

动画.js

$(document).ready(function(){
    color = 'red';
    window.setInterval(function(){
        if(color == 'red'){
            $('div#testing').animate({'background-color': 'blue'}, 'fast', 'easeOutQuint'); 
            color = 'blue';
        }
        else if(color == 'blue'){
            $('div#testing').animate({'background-color': 'red'}, 'fast', 'easeOutQuint');  
            color = 'red';
        }
        console.log(color);
    }, 5000);
});

需要注意的一件事是,控制台每次都会记录颜色变化。但背景颜色没有改变。相反,我不断收到此错误:

Uncaught TypeError: na.easing[this.easing] is not a function

这不仅适用于背景颜色,也适用于边框颜色动画。另外,它无法识别"easeOutQuint"。所有这些都导致人们相信Jquery和Jquery UI之间有问题。我尝试再次下载Jquery和Jquery UI文件,但这并没有解决问题。

普通的Jquery动画,如边距左动画工作得很好。

更新:

我发现这只与Chrome有关。在浏览互联网时,我在使用JQuery的网站上遇到了问题。但它们在其他浏览器(如 Microsoft Edge(中运行良好。这是我的浏览器有问题吗?

background-color更改为backgroundColor

还要确保你的 jquery-ui.js 包含 jquery 缓动s

我想出了问题所在。看来我的本地版本的Chrome正在做一些时髦的事情。所以我重新安装了 Chrome,代码工作正常。它似乎仅适用于Chrome。