Кто-нибудь может, пожалуйста, объяснить этот код jQuery?[дубликат]
-
19-09-2019 - |
Вопрос
Возможный Дубликат:
Кто-нибудь может объяснить этот код jQuery?
Я публиковал это раньше, но я хотел бы уточнить свой вопрос (и, похоже, я не могу сделать это в старой теме).
Этот код является:
$(document).ready(function()
{
var rot=$('#image3').rotate({maxAngle:25,minAngle:-55,
bind:
[
{"mouseover":function(){rot[0].rotateAnimation(85);}},
{"mouseout":function(){rot[0].rotateAnimation(-35);}}
]
});
});
Это взято отсюда: http://wilq32.googlepages.com/wilq32.rollimage222, и там также есть демонстрация функциональности (анимация поворота изображения - 3-я демонстрация на странице).
Что мне нужно объяснить:
Я понимаю, что объявляется переменная ...гниль", но, похоже, я не могу понять, где заканчивается декларация....
Когда переменная используется, она используется как гниль[0], что делает [0] расшифровывается как?это массив?
Я никогда не видел привязать используемый таким образом, исходный синтаксис является
$("селектор").привязать(тип, [данные], fn);
Тогда что же происходит?Что означают все эти запятые и [ ] о чем?
- Что я хотел бы сделать, в конце концов, так это использовать этот скрипт для поворота изображения "X" при нажатии на элемент "Y".Как это можно сделать (желательно без "привязки")?
Спасибо!
Решение
Я думаю, что основные синтаксические проблемы были объяснены другими здесь достаточно хорошо...
С точки зрения:
Что я хотел бы сделать, в конце концов, так это использовать этот скрипт для поворота изображения "X", пока нажимается элемент "Y".Как это можно сделать (предпочтительно без "привязки")?
Попробуй это:
var x=$("#imagex"); //<-- image to be rotated
var y=$("#elemy"); //<-- element to be clicked
var angleOfRotation=45; //<-- angle of rotation
y.bind("click",function(){
x[0].rotateAnimation(angleOfRotation);
});
Другие советы
Объявление заканчивается со 2-й по последнюю точку с запятой.Ссылка фиксируется и будет использована гораздо позже, во время выполнения переданных функций обратного вызова.
rot
это объект jQuery, который не является массивом, но может быть проиндексирован как таковой.
rot[0]
является первым объектом DOM, который соответствует селектору #image3
, т. е.объект с идентификатором image3.
bind
, в данном случае это не функция bind, а часть опций, переданных rotate.
Квадратные скобки [foo, bar]
укажите буквальный массив foo и bar.Фигурные скобки { foo:"foo", бар:"bar"} - это буквальный объект со свойствами foo и bar.
Объявление заканчивается первой точкой с запятой.
rot
присваивается значение, котороеrotate()
возвращает (что, в данном случае, совпадает с результатом$('#image3')
, из-за jQuery синтаксис цепочки методов).Все, что находится междуrotate(
и следующий)
это просто аргументы, переданныеrotate()
.ДА,
[0]
это доступ к массиву.rot[0]
ссылается на первый ("0-й") элемент в массивеrot
.Здесь,
{ maxAngle:25, minAngle:-55, bind: ... }
является "объектным литералом", т.е.синтаксис объекта, обладающего следующими свойствамиmaxAngle
,minAngle
, иbind
.Если вы присвоили этот объект переменнойmyObject
(вместо того, чтобы просто передавать его в качестве аргумента rotate()), затем вы могли бы получить доступ к его свойствам, таким какmyObject.maxAngle
,myObject.minAngle
, иmyObject.bind
.В данном случаеbind
это не функция, это просто имя свойства объекта.
Хорошо, недостающая часть - вот как вы используете приведенный выше код для запуска поворота другим элементом:
var itemYouWannaRotate = $("#imageToRotate").rotate(0);
$("#TriggerElement").click(function(){
itemYouWannaRotate[0].rotateAnimation(90);
});
Спасибо, ребята, все ваши ответы мне очень помогли.