如何 运行 Jquery 在模态弹出按钮上单击的功能

Question

我有一个模态弹出窗口，单击时上面有一个保存按钮，这应该会触发 jQuery 功能 这是我的按钮代码

<button id="btnSave" type="button" class="btn btn-secondary" onclick="SaveChanges">Save Changes</button>

为什么单击按钮时没有触发该功能

谢谢！

Answer 1

嗯，你需要用括号调用你的函数。否则，您只需将函数定义传递给 onclick 事件。

function SaveChanges() {
  console.log('SaveChanges runs!');
}

<button id="btnSave" type="button" class="btn btn-secondary" onclick="SaveChanges()">Save Changes</button>

顺便说一句，无论如何，我不鼓励您像这样使用内联事件处理程序来坚持使用 unobtrusive solution. Instead of that, you may need to use addEventListener：

function SaveChanges() {
  console.log('SaveChanges runs!');
}

const btn = document.getElementById('btnSave');
btn.addEventListener('click', SaveChanges);

<button id="btnSave" type="button" class="btn btn-secondary">Save Changes</button>

或者通过 jQuery 本身，您可以这样做：

$('#btnSave').click(function() {
  console.log('SaveChanges runs!');
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="btnSave" type="button" class="btn btn-secondary">Save Changes</button>