如何添加jQuery代码到HTML页面

$(".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"); 
 
});

谁能帮助？这是我在http://codepen.io/iremlopsum/pen/YPWPap找到的上传功能。试图让它进入我的网站

来源

2015-04-22 justin_graham92

这是jquery不是Javascript！ –

我很困惑。如果你只是想添加它：把它放在一个文件中，并链接到你的HTML中的JS文件？如果你不知道怎么做，我建议你看看[这里]（http://www.w3schools.com/js/default.asp）。此外，请检查[本页]（http://stackoverflow.com/help/how-to-ask） – Jordumus

在复制粘贴此代码之前，您的网页是否具有与此代码中的选择器匹配的元素？ –

1）最佳的做法是让喜欢my.js新的JavaScript文件。将此文件放入根目录 - > js/my.js中的js文件夹中。 2）在my.js文件中，将代码添加到$（document）.ready（function（）{}）范围内。

$(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）添加新的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>

来源

2015-04-22 11:40:24 nikssa23

谢谢你！：d –

之前关闭body标签添加此（参考jQuery库）。其他托管库，可以发现here

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

这

<script> 
    //paste your code here 
</script>

它应该是这个样子

<body> 
........ 
........ 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
<script> Your code </script> 
</body>

来源

2015-04-22 11:34:10

创建了jQuery例如uploadfuntion.js的文件。
将该文件保存在与网站或子文件夹相同的文件夹中。
在HTML页面中粘贴的head部分：<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

，然后参考你的脚本如：<script src="uploadfuntion.js"> </script>

4.Lastly你应该确保有匹配在代码中选择的元素。

来源

2015-04-22 12:04:24 Rinus

如何添加jQuery代码到HTML页面

回答

相关问题