我正在尝试获取类为.genre_prod_title
的所有元素,并在foreach循环中为所有元素打印“ OK”,并在单击时打印“ CLICK”。
编辑:我将JQuery绑定为$,因为我正在使用WordPress开发。
(function($) {
var genre_prod_title_all = $(".genre_prod_title");
console.log(genre_prod_title_all);
$(".genre_prod_title").each(function(index) {
console.log("OK");
$(this).on("click", function(event) {
console.log("CLICK");
});
});
})(jQuery);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
<li><button class="genre_prod_title" id="film">Film</button></li>
<li><button class="genre_prod_title" id="magazine">Magazine</button></li>
<li><button class="genre_prod_title" id="documentaire">Documentaire</button></li>
</ul>
但是变量genre_prod_title_all
的打印(仅用于检查是否选择了所有三个元素)只是显示一个元素,而不会打印“ OK”和“ CLICK”。
答案 0 :(得分:2)
将函数放入内部
$(document).ready(function() {
...
}
答案 1 :(得分:1)
$(document).ready(function(){
$('.genre_prod_title').each(function(element){
console.log('ok');
$(this).on('click',function(event){
console.log('click')
});
})
})
您可以像这样使用纯Javascript来执行
document.addEventListener('DOMContentLoaded', function(){
var elements = document.querySelectorAll('.genre_prod_title');
elements.forEach(function(el, index){
console.log('ok')
el.addEventListener('click', function(event){
console.log('click');
});
});
});
答案 2 :(得分:1)
您只是将$符号放错了位置: (函数($){ 代替 $(function(){