如何将jQuery代码添加到HTML页面 [英] How to add jQuery code into HTML Page
问题描述
p>任何人都可以帮忙吗？这是我在 http://codepen.io/iremlopsum/pen/YPWPap 找到的上传功能。 。
试图进入我的网站
<1>最佳做法是制作新的JavaScript文件，如my.js 。将此文件放入根目录 - > js / my.js中的js文件夹中。
2）在my.js文件中，将代码添加到$（document）.ready（function（）{}）范围内。 $ c $> $（document.ready）（function（）{
$（。icon-bg）。click（function（）{
$（。btn）。toggleClass（ active）;
$（。icon-bg）。toggleClass（active）;
$（。container）。toggleClass（active）;
$ （.box-upload）。toggleClass（active）;
$（。box-caption）。toggleClass（active）;
$（。box-tags） .toggleClass（active）;
$（。private）。toggleClass（active）;
$（。set-time-limit）。toggleClass（active）;
$（。button）。toggleClass（active）;
}）;
$（。button）。click（function（）{
$（。button-overlay）。toggleClass（active）;
}）;
$ b $（。iconmelon）。click（function（）{
$（。box-upload-ing）。toggleClass（active）;
$（。iconmelon-loaded）。toggleClass（active）;
}）;
$（。private）。click（functio n（）{
$（。private-overlay）。addClass（active）;
$（。private-overlay-wave）。addClass（active）;
}）;
}）;
3）将您的新js文件添加到您的html中
< head>
< script src =https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js>< / script>
< script src =/ js / my.js>< / script>
< / head>
$(".icon-bg").click(function () {
$(".btn").toggleClass("active");
$(".icon-bg").toggleClass("active");
$(".container").toggleClass("active");
$(".box-upload").toggleClass("active");
$(".box-caption").toggleClass("active");
$(".box-tags").toggleClass("active");
$(".private").toggleClass("active");
$(".set-time-limit").toggleClass("active");
$(".button").toggleClass("active");
});
$(".button").click(function () {
$(".button-overlay").toggleClass("active");
});
$(".iconmelon").click(function () {
$(".box-upload-ing").toggleClass("active");
$(".iconmelon-loaded").toggleClass("active");
});
$(".private").click(function () {
$(".private-overlay").addClass("active");
$(".private-overlay-wave").addClass("active");
});
Can anyone help? It's for an upload function I found at http://codepen.io/iremlopsum/pen/YPWPap. Trying to get it into my website
1) Best practice is to make new javascript file like my.js. Make this file into your js folder in root directory -> js/my.js . 2) In my.js file add your code inside of $(document).ready(function(){}) scope.
$(document).ready(function(){
$(".icon-bg").click(function () {
$(".btn").toggleClass("active");
$(".icon-bg").toggleClass("active");
$(".container").toggleClass("active");
$(".box-upload").toggleClass("active");
$(".box-caption").toggleClass("active");
$(".box-tags").toggleClass("active");
$(".private").toggleClass("active");
$(".set-time-limit").toggleClass("active");
$(".button").toggleClass("active");
});
$(".button").click(function () {
$(".button-overlay").toggleClass("active");
});
$(".iconmelon").click(function () {
$(".box-upload-ing").toggleClass("active");
$(".iconmelon-loaded").toggleClass("active");
});
$(".private").click(function () {
$(".private-overlay").addClass("active");
$(".private-overlay-wave").addClass("active");
});
});
3) add your new js file into your html
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="/js/my.js"></script>
</head>
这篇关于如何将jQuery代码添加到HTML页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
