gpt4 book ai didi

jquery - 动态添加内容的事件绑定(bind)遇到问题

转载 作者:行者123 更新时间:2023-12-01 05:06:28 25 4
gpt4 key购买 nike

我有一个简单的表单,可以添加关键字,这些关键字有删除按钮,都是 POST 请求,通过 ajax 完成。删除对非动态关键字的请求通过 ajax 工作,但动态添加的关键字回退到 HTTP 请求。我阅读了周围的内容,并将问题范围缩小到了事件绑定(bind)。

var app = {
setupKeywordDeleteForm: function () {
// Was using regex plugin to find form which had ids like list_1, list_2 etc
// $("form:regex(id, list_*)").each ( function () {
$('li').each ( function () {
var $form = $(this);
$form.submit(function(e) {
e.preventDefault();
$.post($form.attr('action'), $form.serialize(), function() {
}, "script");
});
})
},

setupKeywordAddForm: function () {
var $form = $('#add_keywords');
$form.bind('submit', (function(e) {
e.preventDefault();
$.post($form.attr('action'), $form.serialize(), function() {
}, "script");
}));
},
}

jQuery(function () {
app.setupKeywordAddForm();
app.setupKeywordDeleteForm();
});

我一直在阅读learningjquery并搞乱了 livequery 插件,但无济于事。我明白这个问题,只是无法解决它。任何帮助表示赞赏。另外,如果您知道在不循环的情况下定义 setupKeywordDeleteForm(); 的更好方法,请告诉我。

编辑:

问题是,当我通过 ajax 添加新关键字时,它们上的删除按钮会退回到 HTTP 请求,而不是通过 ajax 提交。

最佳答案

感谢 this 成功解决了这个问题和 this 。基本上它在 div.edit_list:last(即新添加的关键字)上调用 setupNew 并在其上设置 .post() 。

var app = {
setupNew: function () {
var $form = $('.edit_list:last');
$($form).submit(function(e) {
e.preventDefault();
$.post($form.attr('action'), $form.serialize(), function() {
}, "script");
});
},

setupKeywordAddForm: function () {
var $form = $('#add_keywords');
$form.submit(function(e) {
e.preventDefault();
$.post($form.attr('action'), $form.serialize(), function() {
app.setupNew();
}, "script");
});
}
}

是的,它有点难看,我可能应该干掉它(我猜我应该创建一个通用的 addKeyword 函数,它接受输入并为现有关键字以及添加新关键字时调用该函数?),但它截至目前为止。感谢大家的帮助。

关于jquery - 动态添加内容的事件绑定(bind)遇到问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5293945/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com