时间戳

首页 > 解决方案 > 如何在模态弹出按钮单击上运行 Jquery 功能

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

问题描述

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

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

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

谢谢你！

标签： jqueryasp.net-mvcbootstrap-modal

解决方案

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

function SaveChanges() {
  console.log('SaveChanges runs!');
}
<button id="btnSave" type="button" class="btn btn-secondary" onclick="SaveChanges()">Save Changes</button>

顺便说一句，无论如何，我不鼓励您使用内联事件处理程序来坚持不引人注目的解决方案。取而代之的是，您可能需要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>

推荐阅读