Ajax jquery，通过Post实现类表单
Ajax jquery，通过Post实现类表单
提问于 2015-07-03 09:07:08
我有3个表单，每个表单都有相同的类，每个表单都将执行ajax jquery。我尝试在下面的代码中发送Ajax，但它为每个表单发送请求。
var form = $(".forms");
form.submit(function() {
$.ajax({
url: 'Servlet',
type: "POST",
data: {
to: $(".param1 option:selected").val(),
from: $(".param2 option:selected").val(),
},
success: function(data)
{
alert("worked");
},
error: function(jqXHR, textStatus, errorThrown) {
alert(jqXHR+" : "+textStatus+" : "+errorThrown);
}
});
})下面是jsp代码
<c:forEach begin="1" end="3" var="i">
<div>
<form method="post" class="forms" action="Servlet" name="forumlario-${i}" onsubmit="return false;">
<div>
<select class="param1" name="param1">
<option value="11">11</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
</select>
</div>
<div>
<select class="param2" name="param2">
<option value="11">11</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
</select>
<div>
<button type="submit" value="calcular" id="calcular" >calcular</button>
</div>
</form>
</div>
</c:forEach>如何获得被点击的特定表单并执行ajax？
我现在找不到解决方案，也没有按属性名称获取表单
//attribute form 1 = name="forums-1"
//attribute form 3 = name="forums-2"
//attribute form 2 = name="forums-3"然后我找到的解决方案是重放代码3x
$('[name="forums-1"]').submit(function() {
//code omitted
});
$('[name="forums-2"]').submit(function() {
//code omitted
});
$('[name="forums-3"]').submit(function() {
//code omitted
});但不是干净的代码，我应该怎么做，为这两种形式只做一条声明
回答 2
Stack Overflow用户
发布于 2015-07-03 09:25:20
您已经多次更改您的问题，因此答案一直在变化。
如何获取被点击的特定表单并执行ajax？
要获取已提交的三个表单实体中的特定表单实体，可以使用this在.submit(function() {})中执行此操作。this变量将表示所提交的三个.forms中的特定表单。然后，您可以根据返回的this执行必要的函数
form.submit(function() {
$(this); //represents the SPECIFIC form that was submitted
});Stack Overflow用户
发布于 2015-07-03 09:25:41
如果我理解正确的话，ajax不会被发送。您应该尝试将return false添加到传递给submit的函数，以防止表单执行其默认行为，而不是发出AJAX请求
form.submit(function() {
$.ajax({
url: 'Servlet',
type: "POST",
data: {
to: $("#param1 option:selected").val(),
from: $("#param2 option:selected").val(),
},
success: function(data)
{
alert("worked");
},
error: function(jqXHR, textStatus, errorThrown) {
alert(jqXHR+" : "+textStatus+" : "+errorThrown);
}
});
return false;
})页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/31197005
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号