如何同时将处理程序附加到静态和动态元素？

Question

我有一个应该在click上触发的功能，并且有两个不同的元素可以做到这一点。一个元素是在页面加载时创建的静态元素，第二个元素是动态的。我想知道是否有办法在单个语句中将它与JQuery结合起来。这是一个例子：

＆＃13;

＆＃13;

$('.show_new').on('click',showElement);
function showElement() {
  $('#test').append("<input type='button' id='dynamic' class='save_form' value='Save'>")
}

$('.save_form').on('click',testFun);
$(document).on('click','.save_form',testFun);
function testFun(e) {
  alert(e.target.id);
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="button" class="show_new" value="Show">
<input type="button" class="save_form" id="static" value="Save">
<div id="test"></div>

＆＃13;

＆＃13;

＆＃13;

正如您在上面的示例中所看到的，唯一可行的方法是将第一行用于静态，第一行用于动态元素事件。如果有人知道更好的方法，请告诉我。谢谢！