var transformString = Modernizr.prefixed('transform');
var inputDown, inputMove, inputUp;
if (window.Touch) {
inputDown = "touchstart";
inputMove = "touchmove";
inputUp = "touchend";
}
else {
inputDown = "mousedown";
inputMove = "mousemove";
inputUp = "mouseup";
}
var mouse = { startX: 0, startY: 0 };
var innerElement = $('.threedee');
function normalizedX(event){
return window.Touch ? event.originalEvent.touches[0].pageX : event.pageX;
}
function normalizedY(event){
return window.Touch ? event.originalEvent.touches[0].pageY : event.pageY;
}
$(document).bind(inputDown, function(event){
event.preventDefault();
if(event.button === 2) return true; // right-click
mouse.startX = normalizedX(event);
mouse.startY = normalizedY(event);
// store the transform state
// globalMatrix.setMatrixValue($inner.css('-webkit-transform'));
$(document)
.bind(inputMove, move)
.one(inputUp, function(){ $(document).unbind(inputMove); });
});
function move(event){
event.preventDefault();
var offsetX = normalizedX(event) - mouse.startX;
var offsetY = normalizedY(event) - mouse.startY;
if(event.shiftKey){
offsetX = roundToMultiple(offsetX, 15);
offsetY = roundToMultiple(offsetY, 15);
}
innerElement.css(transformString, 'rotateY('+offsetX+'deg) rotateX('+-offsetY+'deg)');
/* move relative to the initial position
$inner.css('-webkit-transform', globalMatrix.rotate(-offsetY, offsetX, 0));//*/
}
function roundToMultiple(number, multiple){
var value = number/multiple
, integer = Math.floor(value)
, rest = value - integer;
return rest > 0.5 ? (integer+1)*multiple : integer*multiple;
}
尝试仅查看javascript部分,我的问题就在那里。
我想知道为什么“event”将作为脚本中大多数函数的参数和参数传递。有时它也可能是“e”。谁创造了他们?
我自己从未创建任何“事件”变量,谁负责这个“事件”变量。
答案 0 :(得分:9)
jQuery将调用您的事件函数,它会将一个事件对象传递给参数。您不必担心创建变量,并且可以为参数指定任何您想要的名称(假设它是有效的变量名称)。
事件对象的创建应该被视为“黑匣子”,你不应该担心它的确切结构或实现。只需按照文档和示例的说明进行操作,你就会没事。
关键是在函数中有一个参数;否则,您将无法访问jQuery传递的事件对象。
正如其他一些答案所述,避免名称event
可能是一个好主意,因为如果你不小心,你可能会在某些浏览器上与同名的全局变量发生冲突。相反,使用e
或类似内容,如果您忘记在函数中使用参数,则会获得NameError
。
// Wrong way #1
$('.class').bind('click', function() {
event.preventDefault(); // may attempt to call .preventDefault() on window.event if it exists
});
// Wrong way #2 (fails fast since e probably won't be on the global object)
$('.class').bind('click', function() {
e.preventDefault(); // ReferenceError thrown here
});
// The correct way
$('.class').bind('click', function(e) { // or (event) if you want, but the first example can bite you
e.preventDefault(); // no problem
});
答案 1 :(得分:6)
jQuery将规范化,错误修复和特征化jQuery event object作为第一个参数传递给处理函数。您应该将此参数命名为e
(或类似名称),这样您就不会意外地引用全局window.event
(这是chrome和IE中的本机事件对象),而是会出现快速错误。
答案 2 :(得分:1)
引用e
或event
的函数是回调函数。它们本质上是由jQuery本身调用并传递一个变量作为结果(你在那里定义函数,但它调用它,假设它被定义)。这就是为什么它可以定义为e
或event
(它也可能是purple_elephant
。
参考:http://en.wikipedia.org/wiki/Callback_(computer_programming)