短篇小说，我不知道为什么它不起作用，我已经尝试过Console.Log（）来弄清楚这个＆＃39;这个＆＃39;是和事件只是不断传递窗口。它是一个点击事件，可以激活对此旋转木马中某个人物的影响，这就是为什么我不能单独搜索课程（至少据我所知）。更智能的任何修复？
var carFigure = null;
//----------The Events
$('.figure').click(toggleCarousel(this));
//$('.figure').mouseover(stopCarousel(this));
//$('.figure').mouseleave(startCarousel(carFigure));
//------------Switcharoo function
function toggleCarousel(event) {
var bool = false;
console.log(event)
if (bool) {
stopCarousel(event);
bool = false;
}
else {
startCarousel(event);
bool = true;
}
}
//----------The action functions
function stopCarousel(e) {
if (carFigure != null) { document.getElementById('carousel').style.animationPlayState = "paused";
var p = e.parentElement;
var a = p.getElementsByTagName('DIV')[2];
if (a.getElementsByTagName('IMG')[0].style.transform = "none") {
a.getElementsByTagName('IMG')[0].style.transform = "scale(1.2, 1.2) translateY(-25%)";
a.getElementsByTagName('IMG')[0].style.borderRadius = "100%";
a.getElementsByTagName('H5')[0].style.color = "rgba(255,255,255, 0)";
this.getElementsByClassName('links')[0].style.transform = "translateY(-250%)";
this.getElementsByClassName('links')[0].style.opacity = "1";
carFigure = null;
}
}
};
function startCarousel(e) {
if (e != null) {
carFigure = e;
document.getElementById('carousel').style.animationPlayState = "running";
var p = e.parentElement;
var a = p.getElementsByTagName('DIV')[2];
a.getElementsByTagName('IMG')[0].style.transform = "none";
a.getElementsByTagName('IMG')[0].style.borderRadius = "0";
a.getElementsByTagName('H5')[0].style.color = "rgba(255,255,255, 1)";
this.getElementsByClassName('links')[0].style.transform = "none";
this.getElementsByClassName('links')[0].style.opacity = "0";
}
};--HTML Version (Snippet)
<div class="carcontainer">
<div id="carousel">
<figure>
<div class="figure">
<div class="links">
<a><img src="~/Content/images/LinkedInIco.png" /></a>
<a href="http://www.example.com"><img src="~/Content/images/WebsiteIco.png" /></a>
</div>
</div>
<div>
<h5>Person Name</h5>
<img src="~/Content/images/Name.jpg" alt="" />
</div>
</figure>
<figure>
<div class="figure">
<div class="links">
<a><img src="~/Content/images/LinkedInIco.png" /></a>
<a href="http://www.example.com"><img src="~/Content/images/WebsiteIco.png" /></a>
</div>
</div>
<div>
<h5>Person Name</h5>
<img src="~/Content/images/Name.jpg" alt="" />
</div>
</figure>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
答案 0 :(得分：2)
您没有正确附加事件处理程序。这一行：
$('.figure').click(toggleCarousel(this));
... 立即与toggleCarousel一起调用 this（这就是parens会做的事情）。你真正想要的是将函数对象传递给.click()：
$('.figure').click(toggleCarousel);
<强>更新：
正如@FelixKling指出的那样，您还需要将事件的目标传递给下游函数;看起来他们期望元素，而不是事件。此外，bool每次调用都会重置为false，这不是您想要的;你应该把它放在封闭中：
var flag = false; // "bool" is a reserved word, changed the name
function toggleCarousel(event) {
var element = event.target;
if (flag) {
stopCarousel(element);
}
else {
startCarousel(element);
}
flag = !flag;
}
答案 1 :(得分：1)
.click()事件绑定在点击.figure时不绑定要调用的函数。它使用当时有效的toggleCarousel对象（this）直接拨打window。您需要为.click()提供回调函数。将$('.figure').click(toggleCarousel(this));更改为：
$('.figure').click(function(){
toggleCarousel(this);
});
这样在点击时使用正确的toggleCarousel对象调用this。正如您的代码现在一样，它不符合 JQuery signature for .click() ，并尝试使用受控制的toggleCarousel对象立即调用this首次遇到代码的时间，即window。
this对象绑定在JavaScript中是易失性的...也就是说，它并不始终指向同一个对象，并且它的绑定可以从一行代码更改为下一行代码。 如何调用包含单词this的代码确定它将绑定到哪个对象。
这是一个清单，您可以通过该清单了解
this将绑定的内容 为...
如果调用包含this的代码：
作为对象实例的方法或属性（通过实例变量）：
var o = new Object();
// "this" will be bound to the "o" object instance
// while "someProperty" and "someMethod" code executes
o.someProperty = someValue;
o.someMethod();
通过.call()，.apply()，.bind()或Array.prototype.fn调用：
// "this" will be bound to the object suppled as the "thisObjectBinding"
someFunction.call(thisObjectBinding, arg, arg);
someFunction.apply(thisObjectBinding, [arg, arg]);
var newFunc = someFunction.bind(thisObjectBinding, arg, arg);
注意：当调用回调函数（即事件处理程序）时，触发事件时会对处理程序进行隐式调用。在这些情况下，负责触发事件的对象将成为绑定到this的对象。
此外，一些Array.prototype方法允许传递thisObject，这将在方法调用的持续时间内改变绑定：
Array.prototype.every( callbackfn [ , thisArg ] )
Array.prototype.some( callbackfn [ , thisArg ] )
Array.prototype.forEach( callbackfn [ , thisArg ] )
Array.prototype.map( callbackfn [ , thisArg ] )
Array.prototype.filter( callbackfn [ , thisArg ] )
如果没有其他方案适用，则会发生默认绑定。
3A。 "use strict"生效后this为undefined
3B。没有"use strict"生效：this绑定到全局对象
注意：
使用this也可能会影响a）
eval()绑定，但作为 一般的最佳做法，应避免使用eval()。b）当HTML属性用于将DOM元素连接到事件时 处理程序（即
onclick，onload等），匿名全局包装器 函数是围绕事件处理属性的值创建的， 从而使Global对象（window）成为this对象。这是 避免内联HTML事件属性的几个原因之一。
答案 2 :(得分：0)
这可能不是最好或最直接的答案，但希望这可以帮助您理解您错过的内容。
在javaScript中，this对象在函数调用期间设置，实际上是有效的。 （尽管请注意这里的扩展答案，详细说明如何定义/绑定function this_test () { console.log( this ); }
this_test(); // prints nothing
var x = {f:this_test}; // note, references to functions are not the same as function calls
x.f(); // prints {f:[function]} ie this==x inside the call
this_test.call( x ); // identical in effect to above.
）。考虑一下：
$('.figure').click(toggleCarousel(this));
考虑到这一点，请考虑您写的这一行：
toggleCarousel(this)这样做是设置一个事件处理函数，它是调用this === window的结果。因为这是（我假设）js文件或脚本标记中的顶级代码，在此上下文中$('.figure').click( toggleCarousel );
因为它不在函数内部！
你应该做的是：
function event_handler () {
var $this = $(this);
}
最后，由于您使用的是jQuery，因此您应该使用jQuery方法来查找和修改DOM，因为它更容易（并且符合跨浏览器）。因此有时在jQuery事件代码中看到这个成语：
return强烈建议阅读 - jQuery Click Event - 大多数其他事件处理程序的工作方式类似。