我正在尝试为使用AJAX请求（在Wordpress中）从数据库中收集的数据表构建过滤器。有 2 个下拉菜单和一个提交按钮。问题是当我单击提交按钮时，我的浏览器冻结并收到错误：范围错误：超出最大调用堆栈大小。这是什么原因造成的？
代码在加载页面时加载表（包括下拉菜单和提交按钮）。然后一旦加载，它就会加载"单击提交按钮"功能。
<script>
(function($
jQuery(document).ready(function($){
var amount = 10; //get amount of results to show per page
$.post("<?php echo get_stylesheet_directory_uri(); ?>/ajax_table.php", {
manual_filter: 1,
//sector_id : '<?php echo $sector_id; ?>', //send the data to the page using this format
amount : amount //send the data to the page
}, function(data) {
// data will hold the output from the script.php
$("#table").html(data); //update the div with the output
$("#submit").click(function (){
var sector = document.getElementById("sector_dropdown");
var year = document.getElementById("year_dropdown");
$.post("<?php echo get_stylesheet_directory_uri(); ?>/ajax_table.php", {
manual_filter: '1',
sector_id: sector,
year: year,
amount : amount //send the data to the page using this format
}, function(data) {
// data will hold the output from the script.php
$("#table").html(data); //update the div with the output
});
});
});
});
})(jQuery);
</script>
<div id="table">
</div>
问题是当我单击提交按钮时，我的浏览器冻结了 我收到错误：范围错误：超出最大调用堆栈大小。 这是什么原因造成的？
$("#table").html(data);加载具有id #submit的重复元素？单击#submit时，所有重复的#submit元素click处理程序称为 ？结果添加更多附加click事件的重复#submit元素，调用所有重复#submit元素的click处理程序。
请注意，id s 在 document 中应该是唯一的。
click事件可以委托给附加到#submit父元素table $.post()完整回调之外的单个处理程序。
我最终修复了它。这与 #submit 按钮无关，而是与下拉菜单有关。这就是让它工作的原因：
var sectorALL = document.getElementById("sector_dropdown");
var sector = sectorALL.options[sectorALL.selectedIndex].value;