同一页面上的两个表单和两个脚本,第一个脚本将被调用而不考虑提交
two forms and two scripts on same page, the first script is invoked regardless of submit
我有一个页面,有两个表单,一个用于提交一些数据并从数据库返回数据,另一个用于在数据库上自动完成搜索,然后从数据库返回信息。这两个表单在不同的页面中按预期工作,现在我试图将它们放在一个页面中,但如果我在第二个表单上执行自动完成/全文搜索,我会从第一个表单中得到结果。我认为问题是javascript在第一个表单中捕获数据,无论按下了什么提交按钮,这两个表单都有不同的操作路线。这是第一个脚本:
jQuery(function ($) {
$(document).ready(function () {
var form = $('form');
form.submit(function (e) {
e.preventDefault();
$.ajax({
url: form.prop('action'),
type: 'post',
dataType: 'json',
data: form.serialize(),
success: function (data) {
var obj = (data);
var resultStr = "";
//something
$("#results").html(resultStr);
}
});
});
});
});
第二个
$(document).ready(function () {
$('input:text').bind({});
$('input:hidden').bind({});
$("#models").autocomplete({
minLength: 1,
source: URL
});
});
那么,为什么页面返回resultStr并填充div,而不是我在使用第二个脚本进行全文搜索后询问的数据呢?知道吗?
好的,如果您想将相同的提交事件附加到所有表单,然后确定提交了哪个表单,以便检索表单的action
,例如,您需要按照最初的方式进行,然后在提交块中检索表单对象,如下图所示:
以下是jsFiddle示例:http://jsfiddle.net/bu9v52fm/
jQuery(function ($) {
$(document).ready(function () {
//attach event to all forms
$('form').submit(function (e) {
//output $(this) form into a variable and proceed
//--------------
var form = $(this);
//--------------
e.preventDefault();
$.ajax({
url: form.prop('action'),
type: 'post',
dataType: 'json',
data: form.serialize(),
success: function (data) {
var obj = (data);
var resultStr = "";
//something
$("#results").html(resultStr);
}
});
});
});
});
相关文章:
- 在同一页上的两个脚本中使用全局变量
- JavaScript - 需要帮助组合两个脚本
- 加载两个脚本块(使用lab.js作为加载管理器)
- 如何使用jquery或vanillajavascript从iframe中获取两个脚本src
- 当我在一个html页面上添加两个脚本时,其中一个不起作用
- 在 HTML 上运行两个脚本(Java 脚本)
- 原型:这两个脚本之间的区别
- 两个脚本不会同时工作
- 组合两个脚本以在所有浏览器上保存Google图表时出现问题
- 如何合并两个脚本并同时触发它们
- jQuery结合了两个脚本来实现对锚点的平滑滚动
- 如何链接两个脚本
- 两个脚本出现Jade渲染错误,未捕获语法错误:意外的令牌<
- 单击来自同一元素上两个脚本的事件
- 使用jquery.on()方法处理同一元素(选项标记)的两个脚本之间的冲突
- 同一页面上的两个表单和两个脚本,第一个脚本将被调用而不考虑提交
- 使用服务器从两个脚本发送的事件
- 为什么'我的两个脚本都不能在html中工作
- 两个脚本(FitVids.js,Vimeo.js)一起杀死调用一个函数来播放视频,导致:VimeoAPI不是一个函数
- 是否可以让HTML中的一个链接执行两个脚本