在JavaScript中，在表单提交时触发一个事件通常涉及到监听表单的submit事件。你可以使用addEventListener方法来为表单添加一个事件监听器，当表单提交时执行特定的函数。

以下是一个基本的例子，展示如何实现在表单提交时执行一个函数：

HTML 表单

首先，你需要一个HTML表单：

<form id="myForm">
  <input type="text" name="username" />
  <input type="password" name="password" />
  <button type="submit">Submit</button>
</form>

JavaScript

然后，你可以使用JavaScript来监听这个表单的submit事件，并在提交时执行一些操作：

// 获取表单元素
var form = document.getElementById('myForm');

// 为表单添加submit事件的监听器
form.addEventListener('submit', function(event) {
  // 阻止表单的默认提交行为
  event.preventDefault();

  // 在这里执行你的逻辑，例如：收集数据、验证数据等
  var username = form.username.value;
  var password = form.password.value;
  
  console.log('Username:', username);
  console.log('Password:', password);
  
  // 你可以在这里添加更多的逻辑，例如发送数据到服务器等
  // 例如使用 fetch API 发送数据到服务器：
  // fetch('/your-endpoint', {
  //   method: 'POST',
  //   headers: {
  //     'Content-Type': 'application/json',
  //   },
  //   body: JSON.stringify({username, password}),
  // })
  // .then(response => response.json())
  // .then(data => console.log(data))
  // .catch(error => console.error('Error:', error));
});

解释：

1. ‌获取表单元素‌：通过document.getElementById获取表单元素。

2. ‌添加事件监听器‌：使用addEventListener为表单的submit事件添加一个监听器。当表单提交时，这个函数会被调用。

3. ‌阻止默认行为‌：通过调用event.preventDefault()来阻止表单的默认提交行为（即不自动提交表单）。这样做可以让你在数据被发送到服务器之前，先进行一些操作，比如验证数据。

4. ‌执行自定义逻辑‌：在阻止默认行为之后，你可以执行任何自定义的逻辑，比如收集数据、验证数据等。如果一切正常，你可以手动提交表单或通过其他方式（如使用fetch API）发送数据到服务器。

通过这种方式，你可以完全控制表单提交的行为，而不仅仅是依赖于浏览器的默认行为。这对于创建动态的单页应用（SPA）或需要更多控制的前端逻辑特别有用。