javascript - 表单提交上的 Javascript 新按钮

Question

我试图让我的程序在表单提交上创建一个新按钮。我知道我做错了什么，但不知道如何解决。这是我的代码：

$("#searches").append('<button id="recent-searches">' + textbox + '</button>')

然后后来我有：

$("#recent-searches").on('submit', function() {

我认为代码的第二部分是我出错的地方。任何帮助都是极好的。

谢谢！

Answer 1

submit按钮没有事件，您是说click还是在表单上提交事件？

尝试

$("#recent-searches").on('click', function() { // if you are biding this after appending the button.

别的

$(document).on('click',"#recent-searches" function() { // if you are binding this prior to appending the button to the DOM. use $("#searches").on(... if that element is available all the time in DOM.

如果#searches是一种形式，那么你会这样做：

$("#searches").on('submit', function(){...

Answer 2

$("#recent-searches").on('submit', function() {

这将绑定到与recent-searches该事件的 id 匹配的元素。如果元素不存在，那么 jQuery 将什么也不做。您必须将事件绑定到整个文档（或绑定到将包含 id 元素的父级recent-searches）并指定 ID，如下所示：

$(document).on('click', '#recent-changes', function() {

在这种情况下，我认为这样的事情应该有效：

$('#searches').on('click', '#recent-changes', function() {

由于#recent-changes被附加到该元素。

请记住，submit单击该按钮时不会触发该事件，因为它不是提交按钮，您可以使用以下代码：

$("#searches").append('<input type="submit" id="recent-searches" value="' + textbox + '" />');

Answer 3

您正在创建一个按钮，当您单击它时#recent-searches，它将接收事件等。click但是它不会触发submit事件，因为这些事件仅适用于单击类型form元素时的元素。inputsubmit

所以你会有一个表格，让我们说：

<form id="searches"> ... </form>

在您附加按钮的位置，可能是这样：

$("#searches").append('<input type="submit" id="recent-searches">' + textbox + '</input>');

，然后你会这样做：

$("#searches").on("submit", function (e) { ... });

或者你也可以让你的button但绑定一个click事件，而不是像这样：

$("#recent-searches").on("click", function (e) { ... });