Вместо захвата IMG ID вы можете просто использовать this:
Использование метода on позволяет добавлять элементы после привязки события.
$(document).on("click", ".filters img", function() {
alert("clicked");
$(this).fadeTo("slow", 1);
});
О вашемпеременные, есть ли какие-либо изменения, которые вы можете изменить в объекте?
var vars = {
categoryAdvertising: false,
categoryInformation: false
};
, затем вы можете переключать их, используя: (в вашем событии щелчка)
vars[this.id] = !vars[this.id];
this относится кщелкнул элемент DOM.Таким образом, вы можете просто захватить идентификатор, используя this.id
См .: http://jsperf.com/jquery-attr-id-vs-this-id
ПРИМЕЧАНИЕ:
Se, как приятно оператор !работает.
!true is false
!false is true
Если вы связываете событие click с тегом li, как я это сделаю позже.Вы можете захватить идентификатор, используя:
$(this).children("img")[0].id
или
$(this).children("img").attr("id");
Вы просто хотите исчезнуть, чтобы переключить изображение? Вы можете использовать fadeToggle
$(document).on("click", ".filters img", function() {
alert("clicked");
$(this).fadeToggle("slow");
});
проблема здесь в том, что когда изображение скрыто, оно получает display:none; и, следовательно, не может быть нажато снова: http://jsfiddle.net/jJDvc/1/
Исправление может бытьпривязать событие click к его родительскому элементу (элемент li): http://jsfiddle.net/jJDvc/2/
$(document).on("click", ".filters li", function() {
$(this).children("img").fadeToggle("slow");
});
, а затем иметь некоторый стиль для родительского элемента.
li {
height:100px;
width:100px;
}
Надеюсь, что это ответит на некоторые из ваших многочисленных вопросов.