AJAX 响应缓存/onclick-event 函数内部
AJAX response caching / onclick-event inside of a function
我正在使用 AJAX 执行一些 server-side 操作并刷新页面内的 table 而无需重新加载页面本身。乍一看一切正常。但是我在PHP中写了一个函数来发送邮件并通过AJAX执行。当我第二次开始此操作时,会触发旧响应。
到底发生了什么:
- 我正在单击一个按钮来执行 "Sendmail-Action"
- 模态框询问我是否要执行操作,我单击是
- a PHP-Script 被执行并发送电子邮件
- 模态框在 PHP-Script 完成后关闭(~2 秒)
- table(包括电子邮件等)得到刷新并更新状态
接下来会发生什么:
- 我正在单击一个按钮来执行相同的 "Sendmail-Action"
或我的 table
中的另一个条目
- 模态框询问我是否要执行操作,我单击是
- 事件触发两次/4xAjax-Request 而不是 2(我可以在我的 Chrome-Console 中看到它)
- 模态窗口关闭并发送 2 封邮件
我试图摆脱这种行为的方法:
- 用 JSHint 检查我的 JS
- 检查了我的 PHP-Code(apache error.log 中没有错误)
- 重新设计了PHP-Script(Sendmail),现在AJAX执行了一个功能
- 尝试了不同的浏览器
- 已停用AJAX-Caching
- 完全停用 Apache 缓存(正确 Headers)
- 在我的 php.ini 中停用 Session-Caching(我不使用会话)
- 取消设置 PHP
中的所有变量
- 清除了我所有浏览器的缓存
- 检查了所有 headers
- 搜索了几个小时的解决方案
有关我的设置的更多信息:
- jQuery 2.1.4
- php 5.4
- 阿帕奇 2.2
我找不到问题的解决方案,这可能是因为我将内容动态添加到 table。我过去遇到过同样的问题,我认为模态(也是动态的)会触发两次 "Yes-Button" 的点击。
您可以将 ajax 点击处理程序放在该函数之外:
$(document).on('click', '.email-resend, .email-send, .show-doc, .show-acc, .more-acc, .no, .yes, .termin', function(){
$.fn.doAction(classname, comEntry);
});
正如您提到的,您已将其放入函数中。相反,你应该把它放在外面:
$(document).on('click', '.bt-ok', function(){
$.ajax({
....
});
});
由@pandora 编辑: 或者像这样使用第二个函数(在我的例子中):
$(document).on('click', '.bt-ok', function(){
$.fn.sendRequest($('#modal').attr('data-1'), $('#modal').attr('data-2'));
});
然后我可以像这样调用函数并执行 AJAX:
$.fn.sendRequest = function(data1, data2) {
$.ajax({
url: 'target.php',
cache: false,
data: { gimme1 : data1, gimme2 : data2 },
success: function(response) {
// Show Error
if(response.length > 0){
alert(response);
}
// Reload Content
$.fn.Reload('','');
// Close Modal
$('#modal').css({'display' : 'none'});
}
});
};
我正在使用 AJAX 执行一些 server-side 操作并刷新页面内的 table 而无需重新加载页面本身。乍一看一切正常。但是我在PHP中写了一个函数来发送邮件并通过AJAX执行。当我第二次开始此操作时,会触发旧响应。
到底发生了什么:
- 我正在单击一个按钮来执行 "Sendmail-Action"
- 模态框询问我是否要执行操作,我单击是
- a PHP-Script 被执行并发送电子邮件
- 模态框在 PHP-Script 完成后关闭(~2 秒)
- table(包括电子邮件等)得到刷新并更新状态
接下来会发生什么:
- 我正在单击一个按钮来执行相同的 "Sendmail-Action" 或我的 table 中的另一个条目
- 模态框询问我是否要执行操作,我单击是
- 事件触发两次/4xAjax-Request 而不是 2(我可以在我的 Chrome-Console 中看到它)
- 模态窗口关闭并发送 2 封邮件
我试图摆脱这种行为的方法:
- 用 JSHint 检查我的 JS
- 检查了我的 PHP-Code(apache error.log 中没有错误)
- 重新设计了PHP-Script(Sendmail),现在AJAX执行了一个功能
- 尝试了不同的浏览器
- 已停用AJAX-Caching
- 完全停用 Apache 缓存(正确 Headers)
- 在我的 php.ini 中停用 Session-Caching(我不使用会话)
- 取消设置 PHP 中的所有变量
- 清除了我所有浏览器的缓存
- 检查了所有 headers
- 搜索了几个小时的解决方案
有关我的设置的更多信息:
- jQuery 2.1.4
- php 5.4
- 阿帕奇 2.2
我找不到问题的解决方案,这可能是因为我将内容动态添加到 table。我过去遇到过同样的问题,我认为模态(也是动态的)会触发两次 "Yes-Button" 的点击。
您可以将 ajax 点击处理程序放在该函数之外:
$(document).on('click', '.email-resend, .email-send, .show-doc, .show-acc, .more-acc, .no, .yes, .termin', function(){
$.fn.doAction(classname, comEntry);
});
正如您提到的,您已将其放入函数中。相反,你应该把它放在外面:
$(document).on('click', '.bt-ok', function(){
$.ajax({
....
});
});
由@pandora 编辑: 或者像这样使用第二个函数(在我的例子中):
$(document).on('click', '.bt-ok', function(){
$.fn.sendRequest($('#modal').attr('data-1'), $('#modal').attr('data-2'));
});
然后我可以像这样调用函数并执行 AJAX:
$.fn.sendRequest = function(data1, data2) {
$.ajax({
url: 'target.php',
cache: false,
data: { gimme1 : data1, gimme2 : data2 },
success: function(response) {
// Show Error
if(response.length > 0){
alert(response);
}
// Reload Content
$.fn.Reload('','');
// Close Modal
$('#modal').css({'display' : 'none'});
}
});
};