如何通过事件侦听器点击后ID功能

我很新的HTML5/Javascript/CSS3和即时通讯混淆了如何将我的事件侦听器的ID传递给新的函数。我正在建立一个视频播放器，这是音量上下的部分，我宁愿能够使用一个函数来调高音量和使用if语句来检查音量。如何通过事件侦听器点击后ID功能

这里是什么即时通讯与工作：

volume_up = document.getElementById('volume_up'); //get the volume_up button 
volume_up.addEventListener('click', volumeUp, false); //call function "volumeUp" on click

这里是“volumeUp”功能：

function volumeUp(click_button){ 
alert(click_button.id); // i want to be able to get the id here 
myMovie.volume = myMovie.volume - 0.1; 
}

如果我能得到的ID，我可以做卷起来，卷下来在这个函数中，而不是2个通过if语句。

我也试着这样做：

volume_up.addEventListener('click', volumeUp(volume_up), false);

和

volume_up.addEventListener('click', volumeUp(volume_up.id), false);

没有运气。我将音量调高按钮连接起来，每当我按下它时，音量就会改变，并且弹出警报，但它说未定义。

任何帮助，将不胜感激。谢谢:)

来源

2012-03-18 Jacob

在事件处理程序“this”绑定到触发事件的元素，所以你可以使用“this.id”。

看看这个例子：http://jsfiddle.net/vyGdJ/

来源

2012-03-18 07:28:10

当我这样做时，它会回来作为undefined..hmmm – Jacob 2012-03-18 07:29:05

警报框说undefined * – Jacob 2012-03-18 07:29:22

您使用哪个浏览器？ – 2012-03-18 07:30:32

document.getElementById('volume_up').addEventListener('click', _volume, false); 
document.getElementById('volume_down').addEventListener('click', _volume, false); 

function _volume(event){ 
    if(this.id == 'volume_up') { 
     myMovie.volume += 0.1; 
    } else { 
     myMovie.volume -= 0.1; 
    } 
}

这仅仅是一个例子。您需要使用一些防御性逻辑来检查IE，并在适用时使用attachEvent。

这些没有工作的原因...

volume_up.addEventListener('click', volumeUp(volume_up), false); 
volume_up.addEventListener('click', volumeUp(volume_up.id), false);

...是因为你调用函数并传递的volumeUp的结果作为回调，这将不会是一个typeof == 'function'

来源

2012-03-18 07:32:41 AlienWebguy

如何通过事件侦听器点击后ID功能

回答

相关问题