Как добавить событие, не удаляя существующее, но предотвращая отправку формы

Question

Я на самом деле пытаюсь добавить событие в существующую форму.

Эта форма взята из плагина Wordpress, поэтому у меня нет доступа к его коду.

Я хочу сохранить событие этой формы, добавив операцию (скажем, простое alert), а затем запретив эффект отправки кнопки по умолчанию.

Вот мой код:

<div id="myModal" class="modal">
  <div class="modal-content">
      <span class="close">&times;</span>
      [salesforce form="1"] // this is the form generated by the plugin
  </div>
</div>
<script>
var form = document.getElementById("sf_form_salesforce_w2l_lead_1");
</script>

Итак, я хотел бы, чтобы в моей форме были следующие операции:

• Эффекты Saleforce, которые отправляют мою форму в мой аккаунт saleforce, включенный в плагин

• Другая функция, как мы уже говорили, простая alert();

• Предотвращение эффекта форм по умолчанию, что означает отсутствие обновления страницы и отправки, чтобы выполнить собственное перенаправление в другое место

Понятия не имею, возможно ли это, но если да, то спасибо за помощь!

Answer 1

Вы должны иметь возможность прикрепить несколько обработчиков событий к вашей форме:

function originalEventHandler() {
  console.log('Original');
}

function additionalHander() {
  alert('New handler');
}

$('form').on('submit', function(){
  originalEventHandler();
});


$('form').on('submit', function(e) {
  e.preventDefault();
  additionalHander();
});

JSFiddle