Изменить атрибут onClick через Javascript

Question

Я хочу добавить больше функциональности к уже обработанному коду кнопки.Единственный способ сделать это - это Javascript, так как он раньше обрабатывался с сервера, и у меня есть доступ только к JSP.

Вот то, что у меня есть сейчас, но оно не работает, оно просто отображает одно и то же сообщение дважды.И если я нажимаю на кнопку, предупреждение «привет» не отображается.

<script type="text/javascript">
function addEventBefore(element, type, fn) {
  var old = element['on' + type] || function() {};
  element['on' + type] = function () { fn(); old(); };
}

function sayHello(){
  alert('hello');
}

var arr = document.getElementsByTagName("button");
for (i = 0; i < arr.length; i++) {
  if (arr[i].getAttribute("name") == "Complete"){
    var theclick = arr[i].getAttribute("onClick");
    alert(theclick);
    addEventBefore(arr[i], 'Click', sayHello);
    var theclick2 = arr[i].getAttribute("onClick");
    alert(theclick2);
  }
}
</script>

Это обработанный исходный код страницы:

<td valign='top' align='right' >
 <button  name="Complete"  title="The complete Button"
 onClick="document.forms.TaskInfoPage.action='http://prodserver:8080/Approval.jsp?windowId=dd4c0&eventTarget=stepApproval&eventName=Complete'
 document.forms.InfoPage.submit();return false;">Complete</button>
</td>

Итак, я хочу разместитьsayHello () перед выполнением действия на onClick.

Answer 1

Это onclick, а не onClick, так что вам нужно это:

addEventBefore(arr[i], 'click', sayHello);
                     // ^ lower case here

Сам атрибут по-прежнему не будет отображать ничего другого, но само событие будет работать, вы можете проверить его здесь . Кроме того, чтобы сохранить this для ваших обработчиков событий, я рекомендую вам по крайней мере .call() функций, например:

function addEventBefore(element, type, fn) {
  var old = element['on' + type] || function() {};
  element['on' + type] = function () { fn.call(this); old.call(this); };
}