jquery toggleclassが機能していませんか?
-
28-09-2019 - |
質問
非常に簡単に言えば:ライン currentItem.toggleClass('open');
うまくいかないようです。
より正確には、結果をFirebugで検査すると、関連する要素に「開いている」クラスが点滅する(表示され、すぐに消えている)を見ることができます。そのため、関数が実際に2回トリガーされているようなものです(もちろん、1回だけクリックします)。
誰かが私にこれがなぜなのか、そしてそれを防ぐ方法を説明できますか?
これが私のjQueryコードです:
$('div.collapse ul.radio_list li input[type=radio]').click(function (event) {
var currentTree = $(this).parent().parent().parent();
var currentItem = $(this).parent().parent();
var currentGroup = currentItem.attr('rel');
$(this).parents('ul').children('li').removeClass('select');
if ($(this).is(':checked')) {
currentItem.addClass('select');
}
currentItem.toggleClass('open');
var currentLevel = 0;
if (currentItem.is('.level1')) {currentLevel = 1;}
if (currentItem.is('.level2')) {currentLevel = 2;}
if (currentItem.is('.level3')) {currentLevel = 3;}
var nextLevel = currentLevel + 1;
currentTree.children('li').filter('li[rel ^=' + currentGroup + '].level' + nextLevel).animate({'height': 'show', 'opacity': 'show'}, 250).addClass('currentChild');
});
そして、ここに私のHTMLコードの一部があります。読みやすくするためにわずかに簡素化されます(私が知っているほどきれいではありませんが、HTML出力の制御は限られています):
<div class="col_left collapse">
<ul class="radio_list" rel="7">
<li class="onglet level0" rel="group1">
<span class="onglet level0">
<input type="radio" />
<label>Services Pratiques</label></span>
<input type="hidden" value="1">
</li>
前もって感謝します。
解決
問題解決:JSファイルは実際にはHTMLヘッドに2回含まれていたため、クリックするたびに関数が2回トリガーされました。
他のヒント
私は自分のサイトで同様の問題を抱えていましたが、最初にそれをいじっているときに、底のトググレクラスフックを誤って複製したことがわかりました。おっと!ダブルコールを探してください!
私はこれを行うのと同様の問題がありました:
HTML:
<a>JS-link</a>
JS:
$('a').click(function(event) {
... my stuff ...
# Forgot to do event.preventDefault(); !!
}
クリックが2回登録されます!
私は同じ問題を抱えていて、誤って関数を2回拘束したことに気付きました。私はもともと、コードを1つのJavaScriptファイルから別のJavaScriptファイルに移動することを意図していましたが、誤ってオリジナルをその場所に残しました。
所属していません StackOverflow