将参数传递给Mouseenter/Mouseout JS回调
我提出了这一挑战,其中圆形的颜色是根据光标运动的类型进行更改。
我必须使用togglecolor()函数才能在光标移到其上时用橙色填充圆圈。然后,我必须重复使用相同的功能将其填充在光标离开后。
必须完成此操作,以使用参数iSentering为具有不同值的togglecolor()。 (为了做到这一点,我在.addeventListener()的回调中调用.togglecolor()函数
const element = document.querySelector('#element');
const toggleColor = (isEntering) => {
element.style.background = isEntering ? 'orange' : 'black';
};
element.addEventListener('mouseenter', ()=>toggleColor(true))
element.addEventListener('mouseout', ()=>toggleColor(false))
。我在哪里失败了
? “ rel =“ nofollow noreferrer”> https://www.jschallenger.com/javascript-dom-ercercises/events-and-yevents-and-user-interactions/cursor-enter-enter-enter-leave-event
I'm presented this challenge where the circle's color is to change depending on the type of cursor movement.
I must use the function toggleColor() in order to fill the circle with orange when the cursor moves onto it. Then, I got to reuse the same function to fill it in black once the cursor leaves it.
This must be done calling the toggleColor() with different values for the parameter isEntering. (In order to do this, I'm invoking the .toggleColor() function inside the callbacks of the .addEventListener()'s.
const element = document.querySelector('#element');
const toggleColor = (isEntering) => {
element.style.background = isEntering ? 'orange' : 'black';
};
element.addEventListener('mouseenter', ()=>toggleColor(true))
element.addEventListener('mouseout', ()=>toggleColor(false))
That's my solution to the challenge, and even though it does the work, the tests are not passing. Where am I failing at?
Here is the link to the challenge: https://www.jschallenger.com/javascript-dom-exercises/events-and-user-interactions/cursor-enter-leave-event
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
正确的是:
element.AddeventListener('MouseOver',()=> toggleColor(true));
element.AddeventListener('Mouseleave',()=> togglecolor(false));
The correct is:
element.addEventListener('mouseover', () => toggleColor(true));
element.addEventListener('mouseleave', () => toggleColor(false));
我使用了以下内容,对我有用。希望这会有所帮助。
I used the following and it worked for me. Hope this helps.