2015-02-03 4 views
0

Я пытаюсь просто получить идентификатор нажатой кнопки и использовать предупреждение для его отображения. Код ниже пытается установить addEventListener, если не возвращается к attachEvent. Чтобы получить ID, я пытаюсь передать this.id в качестве параметра myFunction. но это не работает. Я видел множество отличных решений с использованием Jquery и подобных, но, к сожалению, для этого я должен использовать только простой JS. Как получить идентификатор нажатой кнопки и сохранить ее в отображаемой переменной?Получить идентификатор нажатой кнопки javascript

function addEvents() 
{ 
    var buttonArray=document.getElementsByClassName('mainButton'); 
    for(i=0; i < buttonArray.length; i++) 
    { 
     if (document.addEventListener) { 
     buttonArray[i].addEventListener("click", myFunction(this.id)); 
     } else if (document.attachEvent) { 
     buttonArray[i].attachEvent("onclick", myFunction(this.id)); 
} 

function myFunction(clickedId) { 
    alert("Button" + clickedId + "was clicked."); 
} 
} 
    } 
+0

Отвечает ли это ваш д ?: http://stackoverflow.com/questions/4825295/javascript-onclick-to-get-the-id-of-the-clicked-button –

ответ

1

На самом деле вам не нужно передать аргумент в myFunction. Это функция обратного вызова, и вы можете использовать переменную события.

function addEvents() 
{ 
    var buttonArray = document.getElementsByClassName('mainButton'); 
    for(i = 0; i < buttonArray.length; i++) 
    { 
     if (document.addEventListener) { 
      buttonArray[i].addEventListener("click", myFunction); 
     } 
     else { 
      if (document.attachEvent) { 
       buttonArray[i].attachEvent("onclick", myFunction); 
      } 
     } 
    } 
} 

function myFunction(e) { 
    alert("Button " + e.target.id + " was clicked."); 
} 

Вот jsfiddle.

+0

Кто-то ответит что-то на самом деле аналогично этому, но я выбираю это как ответ главным образом потому, что вы указали, что myFunction() находится в цикле for. Спасибо! – exeleon

0

Вы должны изменить код следующим образом:

function addEvents() 
{ 
    var buttonArray = document.getElementsByClassName('someclass'); 

    for(i=0; i < buttonArray.length; i++) 
    { 
     if (document.addEventListener) { 
      buttonArray[i].addEventListener("click", myFunction); 
     } else if (document.attachEvent) { 
      buttonArray[i].attachEvent("onclick", myFunction); 
     } 

     function myFunction(e) { 
      alert("Button" + e.target.id + "was clicked."); 
     } 
    } 
} 

туРипсЫоп функция обратного вызова, с помощью MYFUNCTION (ID) вы вызова функции, таким образом, победив цель обратного вызова.

0

В настоящее время этот код проходит через кнопки mainButton на странице, а для каждой кнопки вызывает myFunction и устанавливает приемник событий как возвращаемое значение myFunction. Поскольку myFunction ничего не возвращает, слушатель событий также не получает ничего. Возможно, то, что вы ищете, вместо этого, что-то вроде этого:

if (document.addEventListener) { 
    buttonArray[i].addEventListener("click", 
     function() { myFunction(this.id); }); 
} 
else if (document.attachEvent) { 
    buttonArray[i].attachEvent("onclick", 
     function() { myFunction(this.id); }); 
} 

Было бы также, вероятно, будет preferrable переместить декларацию MYFUNCTION быть вне для цикла.

0

Попробуйте это:

Element.prototype.addEvent = function(eventName, callFunction) { 
 
    if (this.addEventListener) this.addEventListener(eventName.substring(2), callFunction, false); 
 
    else if (this.attachEvent) this.attachEvent(eventName, callFunction); 
 
}; 
 

 

 
function clicked(e) { \t 
 
    alert(this.id); 
 
} 
 

 

 
document.getElementById('myButton').addEvent('onclick', clicked);
<input id="myButton" type="button" value="Click me">

Смежные вопросы