我正在寻求执行一个基本的表单帖子,但是以下内容在Chrome和Safari中提交给服务器两次(但在Firefox中表现如预期):
<form id="create-deck-form" action="/decks/create" method="post">
<fieldset>
<legend>Create new deck</legend>
<label for="deck-name-field">Name</label>
<input id="deck-name-field" name="deck-name-field" type="text" value="" maxlength="140" />
<label for="tag-field">Tags</label>
<input id="tag-field" name="tag-field" type="text" value="" maxlength="140" />
<input class="add-button" type="submit" value="Create" />
</fieldset>
</form>
Run Code Online (Sandbox Code Playgroud)
我想onsubmit在提交之前使用该属性对字段执行验证,但无论返回值是什么true,表单都会提交两次.
我试图将jQuery处理程序绑定到表单,但是在这里也没有阻止默认行为,表单被提交两次,例如:
<script type="text/javascript">
$(document).ready(function() {
$("#create-deck-form").submit(function(event){
if($("#deck-name-field").val() == "") {
event.preventDefault();
alert("deck name required");
}
});
});
</script>
Run Code Online (Sandbox Code Playgroud)
虽然我认为这对于一双新鲜的眼睛有一些令人眼花缭乱的明显错误,但我深感困惑的是,为什么提交(无论有无验证)都会在Chrome和Safari中向服务器发送重复的帖子.任何见解都会让我感激不尽.
我正在重构我使用$.ajaxjQuery 表单插件提交表单的用法。该API的状态,有可能通过任何传递给选项$.ajax来$.ajaxSubmit。我希望修改 中的选项对象beforeSubmit,添加一个data属性。警告options.beforeSubmitin的值processSubmit表明这是由处理程序初始化的选项对象,并且数据已设置,但由于选项对象已经在没有data属性的情况下进行了初始化,因此它不包含在发送到服务器的帖子中。是否可以在 中beforeSubmit或以其他方式修改选项对象?
当文档准备好时,我将一个处理程序绑定到submit():
$("#myform").submit(function() {
var options = { dataType: 'json',
beforeSubmit: processSubmit,
success: endSubmit };
$(this).ajaxSubmit(options);
return false;
});
Run Code Online (Sandbox Code Playgroud)
该processSubmit(arr, $form, options)函数将要发送到服务器的数据打包为 JSON:
function processSubmit(arr, $form, options) {
var followers =[];
$($("#follower-multi-select").children().filter("li")).each(function() {
if ($(this).hasClass("selected")) {
var fwr = $(this).attr("id");
followers.push(fwr);
}
});
var postData = { followers : followers };
alert('beforeSubmit is: …Run Code Online (Sandbox Code Playgroud)