我已经查看了这个问题的许多其他答案,但找不到适合我的情况的答案。我想使用两个 .js 文件,但只有其中一个有效。我认为一定存在某种冲突,但我不知道它是什么。
这是我的头部部分。
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript" src="bower_components/jquery/dist/jquery.min.js"></script>
<script type="text/javascript" src="bootstrap.min.js"></script>
<script type="text/javascript" src="bower_components/FlowType.js/flowtype.js"></script>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet">
<link rel="stylesheet" href="bootstrap.min.css">
<link href="main.css" rel="stylesheet">
</head>
然后我在结束正文标记之前调用这些脚本。
<script type="text/javascript">
$j = jQuery.noConflict();
$j(document).ready(function() {
$j("body").flowtype({
minimum: 300,
minFont: 12,
maxFont: 40,
fontRatio: 30
});
$j("nav").flowtype({
minFont:8,
maxFont: 14,
fontRatio: 23
});
$j(".jumbotron").flowtype({
fontRatio:100
});
$j(".established h5").flowtype({
minFont: 16,
maxFont: 45,
fontRatio: 16
});
$j("h1").flowtype({
minFont: 16,
maxFont: 45,
fontRatio: 12
});
$j("h2").flowtype({
minFont:16,
maxFont:40,
fontRatio:15
});
$j("h3").flowtype({
minFont:12,
maxFont:35,
fontRatio:20
});
$j("h4").flowtype({
minFont:12,
maxFont:35,
fontRatio:20
});
$j("h5").flowtype({
minFont:12,
maxFont:20,
fontRatio:20
});
$j("h6").flowtype({
minFont:12,
maxFont:20,
fontRatio:20
});
$j("p").flowtype({
minFont: 8,
maxFont: 14,
fontRatio: 20
});
$j(".overview").flowtype({
minFont:12,
maxFont:20,
fontRatio:30
});
$j(".slideshow").flowtype({
minFont:12,
maxFont:20,
fontRatio:30
});
$j(".slide img").flowtype({
minFont:12,
maxFont:20,
fontRatio:30
});
$j(".slider-nav").flowtype({
minFont:12,
maxFont:20,
fontRatio:30
});
$j(".info").flowtype({
minFont:12,
maxFont:20,
fontRatio:30
});
$j(".copyright").flowtype({
minFont:12,
maxFont:20,
fontRatio:30
});
});
</script>
<script type="text/javascript" src="app.js"></script>
</body>
flowtype.js 文件如下所示:
(function($){
$.fn.flowtype = function(options) {
.....................
.....................
};
} (jQuery));
app.js 文件如下所示:
var main = function(){
..............................
................................
..............................
}
$(document).ready(main);
我想我已经解决了一些人遇到的 jQuery.noConflict() 问题。我只使用一个 jquery 文件。那么我做错了什么?希望这是我没有发现的愚蠢的事情。
感谢所有帮助!
最佳答案
So what am I doing wrong?
您正在使用jQuery.noConflict()
。它未定义 $
,因此 $(document).ready(main);
将不起作用。
关于javascript - 我有两个不能一起工作的 javascript 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31165882/