Я пытаюсь сделать кусок кода повторно используемым в массовом масштабе без копирования/вставки и изменения определенного "класса" 350 раз.
Это нефункциональный код, который может дать представление о том, что я хотел бы сделать:
$(function(){
var ClassName = $(this).attr('class');
$(ClassName).each.hover(toggle);
});
function toggle() {
$(ClassName).toggleClass('hover');
}
$(function(){
$(ClassName).mouseout(toggle);
});
function toggle() {
$(ClassName).toggleClass('hover');
}
Это рабочий код, но он работает только в классе SPECIFIC & GIVEN:
$(function(){
$('.specific-class').hover(toggle);
});
function toggle() {
$(".specific-class").toggleClass('hover');
}
$(function(){
$('.specific-class').mouseout(toggle);
});
function toggle() {
$(".specific-class").toggleClass('hover');
}
Если возможно - я хотел бы соответствовать только первому классу или быть в состоянии исключить класс из проверки соответствия. Половина элементов также будет иметь класс "ключ", а другая половина будет иметь "карту". Идея состоит в том, что когда вы наводите курсор на ключ или точку на карте, другой будет "загораться" с ним, чтобы облегчить его поиск.
Итак, учитывая четыре div, одна пара будет "div.spot1" с "div.spot1.key", а другая будет "div.spot2" с "div.spot2.key". ".key" необходимо исключить, иначе оба пятна в Легенде будут применены эффект зависания. Я хочу только совпадение для ".spot1" или ".spot2" для любого данного "пятна #",
Если это потребует дальнейшего уточнения, дайте мне знать. Это 2 утра, и я всю ночь пытался это решить.
Как вы описали в вопросе: "it only works on a SPECIFIC & GIVEN class"
Это не ваша настоящая проблема, вы не используете class selector
jquery для выбранного элемента:
Попробуйте: заменить $(ClassName)
на $("." + ClassName)
Объяснение:
Ваш рабочий код:
$('.specific-class').hover(toggle);
// ^
// Here you use class selector, so it working
Код не работает:
var ClassName = $(this).attr('class');
// "ClassName" It only contains the class name for example: "specific-class"
$( ClassName).each.hover(toggle);
// ^
// Here class selector is missing
изменить $(ClassName)
с помощью $("."+ClassName)
;
$(function(){
var ClassName = $(this).attr('class');
$("."+ClassName).each.hover(toggle);
});
function toggle() {
$("."+ClassName).toggleClass('hover');
}
$(function(){
$("."+ClassName).mouseout(toggle);
});
function toggle() {
$("."+ClassName).toggleClass('hover');
}
использование
$("." + ClassName)
внедрен
$(ClassName)
и вам не нужно дважды toogle
функцию toogle
.
Это исправленный код:
$(function(){
var ClassName = $(this).attr('class');//i don't know which object you are pointing here
alert(ClassName);//this will give you undefined
$(ClassName).each.hover(toggle);
$(ClassName).mouseout(toggle);
});
function toggle() {
$(ClassName).toggleClass('hover');
}
С помощью этого фрагмента вы можете выбрать первый класс, поэтому, если у вас есть несколько классов, как вы описали в своем вопросе, он вернет только первый класс в элементе (то есть: spot1)
var ClassName = $(this).attr("class").split(" ")[0];
each
должны быть круглые скобки: `$ (ClassName) .each (). Hover (toggle);`, но кроме этого, да, вы забыли период (ы), как показано в ответах. Кстати, у ваших элементов один класс или несколько?