包括javascript文件吗?
我在包含javascript文件时遇到了一些问题。我的页面上有以下代码块,我想将其移动到一个名为cart.js的单独文件中。问题是,每当我将所有脚本移动到该文件时,它就会停止在我的页面上工作。我曾尝试将整个代码块包装到一个文档中,但没有成功。我不知道如何把这个包括进去 编辑:由于查看控制台的建议,我发现了错误。事实证明,在cart.js中保留对jquery的调用是导致问题的原因包括javascript文件吗?,javascript,html,Javascript,Html,我在包含javascript文件时遇到了一些问题。我的页面上有以下代码块,我想将其移动到一个名为cart.js的单独文件中。问题是,每当我将所有脚本移动到该文件时,它就会停止在我的页面上工作。我曾尝试将整个代码块包装到一个文档中,但没有成功。我不知道如何把这个包括进去 编辑:由于查看控制台的建议,我发现了错误。事实证明,在cart.js中保留对jquery的调用是导致问题的原因 current_fin = "none"; current_mat = "Pine"; current_col = "
current_fin = "none";
current_mat = "Pine";
current_col = "Red";
current_size = "36";
jQuery(document).ready(function($) {
$("#dropdownthree").hide();
});
// Pass the current selection into a variable to use.
function getMaterial() {// function checks material and if plastic hides/shows boxes
var mat = document.getElementById("dropdownone");
current_mat = mat.options[mat.selectedIndex].text;
if (current_mat == "Plastic") {
var col = document.getElementById("dropdownthree");
current_fin = col.options[col.selectedIndex].text;
$("#dropdowntwo").hide();
$("#dropdownthree").show();
} else {
var fin = document.getElementById("dropdowntwo");
current_fin = fin.options[fin.selectedIndex].text;
$("#dropdownthree").hide();
$("#dropdowntwo").show();
}
$.post('php/productajaxtemp.php', {
ourMaterial: current_mat,
ourFinish: current_fin,
ourSize: current_size
}, function (data) {
$("#price").html(data).show();
});
}
function getFinish() {
var fin = document.getElementById("dropdowntwo");
current_fin = fin.options[fin.selectedIndex].text;
$.post('php/productajaxtemp.php', {
ourMaterial: current_mat,
ourFinish: current_fin,
ourSize: current_size
}, function (data) {
$("#price").html(data).show();
});
}
function getColor() {
var col = document.getElementById("dropdownthree");
current_col = col.options[col.selectedIndex].text;
$.post('php/productajaxtemp.php', {
ourMaterial: current_mat,
ourFinish: current_col,
ourSize: current_size
}, function (data) {
$("#price").html(data).show();
});
}
function getSize() {
var sz = document.getElementById("dropdownsize");
current_size = sz.options[sz.selectedIndex].text;
$.post('php/productajaxtemp.php', {
ourMaterial: current_mat,
ourFinish: current_col,
ourSize: current_size
}, function (data) {
$("#price").html(data).show();
});
getMaterial();
}
关联的HTML是
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="js/cart.js"></script>
<form action="cart.php" id="form" method="POST">
<select name="size" id="dropdownsize" onchange="getSize()">
<option>36</option>
<option>48</option>
<option>60</option>
<option>72</option>
</select>
<select name="material" id="dropdownone" onchange="getMaterial()">
<option>Pine</option>
<option>Oak</option>
<option>Walnut</option>
<option>Plastic</option>
</select>
<select name="finish" id="dropdowntwo" onchange="getFinish()">
<option>None</option>
<option>Finished</option>
</select>
<select name="color" id="dropdownthree" onchange="getColor()">
<option>Painted Red</option>
<option>Painted Green</option>
<option>Painted Blue</option>
<option>Painted yellow</option>
<option>Painted white</option>
<option>Primer white</option>
</select>
<input type="submit" value="Add To Cart">
</form>
36
48
60
72
松木
橡树
核桃
塑料
没有一个
完成了
涂成红色
漆成绿色
涂成蓝色
漆成黄色
涂成白色
底漆白
根据您使用的JS脚本,您不能将JS代码复制粘贴到文件中
尝试在文件中的匿名函数中包含JS代码,如下所示:
(function() {
//Your JS
})();
通过这种方式,JS代码将在文件加载后执行并可用。您是否检查了没有错误(在控制台中)以及脚本是否已执行(添加console.log('hi'))?您的.JS文件是否真的位于JS文件夹下的一个目录中?我通过查看控制台找到了它,结果是:你可以使用托管CDN而不是本地。。