jQuery的 - 在父页的DIV中加载表单提交（？）

本文介绍了jQuery的 - 在父页的DIV中加载表单提交（？）的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 我有以下代码，完美的工作......迄今为止。但我想接下来有一个表单加载...阅读下面的代码进行解释。 主页： < li>< a href =content1.phpclass =load-externaldata-target =＃right_section>一些内容< / li>< / li> < div id =right_section>< / div> < script> $（'body'）。on（'click'，'a.load-external'，function（e）{ var target = $（$（this）.attr（'data-target '））; target.load（$（this）.attr（'href'））; e.preventDefault（）; }）; < / script> content1.php < li>< a href =content2.phpclass =load-externaldata-target =＃right_section>一些内容2< / a> ;< /锂> 现在，在content1.php中，所有链接（a = href ...）到#right_section div。 但是在content1.php中，我也有一些表单，我希望它们也加载到同一个div #right_section中。表单示例如下： content1.php中的示例表单： < form action =report_output.phpmethod =getid =graphIt> 如何获取表单（任何表单，可能是页面上的多个表单） div #right_section，没有加载整个页面（现在它） 谢谢！解决方法您需要替换表单的提交处理程序，类似于您替换链接上的常规点击处理程序的方式。 HTML： / p> < form action =report_output.phpclass =load-externalmethod =getid =graphIt数据目标= ＃right_section > JS： e.preventDefault（）; var target = $（ $（this）.data（'target'））; $ .ajax（{ url：$（this）.attr（'action'）， type：$（this） .attr（'method'）， data：$（this）.serialize（）， dataType：'html'， success：function（response）{ target。 html（response）; } }）; }）; I have the following code, which works perfectly ... so far. But I want to next have a form load ... read below this code for an explanation.Main Page:<li><a href="content1.php" class="load-external" data-target="#right_section">Some Content</a></li><div id="right_section"></div><script>$('body').on('click', 'a.load-external', function(e){var target = $( $(this).attr('data-target') );target.load( $(this).attr('href') );e.preventDefault();});</script>content1.php<li><a href="content2.php" class="load-external" data-target="#right_section">Some Content 2</a></li>Now, in content1.php , all links (a=href... ) work great and load into the #right_section div.But on content1.php, I also have some forms, and I would like them to also load into the same div #right_section. A sample of a form is as follows: sample form in content1.php:<form action="report_output.php" method="get" id="graphIt">How can I get a form (any form, might be multiple on the page) to load into the div #right_section, without loading over the entire page (which it does now)Thanks ! 解决方案 You'll need to replace the form's submit handler, similarly to the way you replaced the normal click handler on links.HTML:<form action="report_output.php" class="load-external" method="get" id="graphIt" data-target="#right_section">JS:$('body').on('submit', 'form.load-external', function(e) { e.preventDefault(); var target = $($(this).data('target')); $.ajax({ url: $(this).attr('action'), type: $(this).attr('method'), data: $(this).serialize(), dataType: 'html', success: function(response) { target.html(response); } });}); 这篇关于jQuery的 - 在父页的DIV中加载表单提交（？）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！