jQuery：表单不用$（&＃;＃id）提交submit（），但会用“submit”按钮提交？ [英] jQuery: form not submitting with $("#id").submit(), but will submit with a 'submit' button?

问题描述

 < form method =postaction =load_statements.php？action = loadid =loadForm
 enctype =multipart / form-data> ; 
  

这是我的表单，对我来说看起来很好。在这种形式下，我把这个按钮：

 < input type =buttonname =submitid =submit value =Submitonclick =confirmSubmit（）class =smallGreenButton/> 
  

这是它调用的函数：

load_statements.php？action = checkForReplace ，
 {
 statementType：$（＃statementType）。val（），
 year：$（＃year）。val（）
}，$ b $如果（数据）{
 if（data ['alreadyExists']）{
 if（confirm（语句已经存在于+ $（＃statementType）。html（）++ $（＃year）.val（）+ 
。你确定要用这些设置加载更多的语句吗？（注意：所有重复的文件将被替换）
））{
 $（#loadForm）。submit（）; 
} 
} else {
 $（＃loadForm）。submit（）; 
} 
}，json
）; 
} 
  

如你所见，它调用 $（ #loadForm）。submit（）; ，但表单不提交（即页面不刷新）。为什么会这样？

谢谢！

解决方案

http://api.jquery.com/submit/

jQuery的submit（）事件添加一个事件监听器，当你提交表单时发生。所以你的代码对提交事件基本上没有任何约束。如果您希望提交该表单，则可以使用旧式JavaScript（document.formName.submit（））。

编辑：

我会原封不动地指出我离开的位置（如至少有两个人已经低估了我）。我想说的是，如果你有一个这样的函数，它会混淆你为什么要将值发布到ajax部分，然后使用jQuery来提交表单。在这种情况下，我会将事件绑定到按钮上，然后返回true，如果您希望它返回，则返回false，如下所示：

<$ p $点击（函数（）{
// ajax逻辑来测试你想要的东西
if（ajaxtrue）{return confirm（whatever） ;} else {return true;}
}）;

如果此函数返回true，则表示成功点击提交按钮和正常的浏览器行为发生。然后你还以事件处理程序的形式将逻辑从标记中分离出来。

更有意义？

<form method="post" action="load_statements.php?action=load" id="loadForm"
                            enctype="multipart/form-data">

that is my form, which looks fine to me. in that form, i put this button:

<input type="button" name="submit" id="submit" value="Submit" onclick="confirmSubmit()" class="smallGreenButton" />

here is the function it calls:

function confirmSubmit() {
    // get the number of statements that are matched
    $.post(
        "load_statements.php?action=checkForReplace",
        {
            statementType : $("#statementType").val(),
            year : $("#year").val()
        },
        function(data) {
            if(data['alreadyExists']) {
                if( confirm("Statements already exist for " + $("#statementType").html() + " " + $("#year").val() +
                    ". Are you sure you want to load more statements with these settings? (Note: All duplicate files will be replaced)"
                )) {
                    $("#loadForm").submit();
                }
            } else {
                $("#loadForm").submit();
            }
        }, "json"
    );
}

and as you can see, it calls $("#loadForm").submit();, but the form is not submitting (ie. the page is not refreshing). why is that?

thanks!

解决方案

http://api.jquery.com/submit/

The jQuery submit() event adds an event listener to happen when you submit the form. So your code is binding essentially nothing to the submit event. If you want that form to be submitted, you use old-school JavaScript (document.formName.submit()).

edit:

I'm leaving my original answer intact to point out where I was off (as at least two people have already downvoted me for). What I MEANT to say, is that if you have a function like this, it's confusing why you would post the values in an ajax portion and then use jQuery to submit the form. In this case, I would bind the event to the click of the button, and then return true if you want it to return, otherwise, return false, like so

$('#submit').click( function() {
  // ajax logic to test for what you want
  if (ajaxtrue) { return confirm(whatever); } else { return true;}
});

If this function returns true, then it counts as successful click of the submit button and the normal browser behavior happens. Then you've also separated the logic from the markup in the form of an event handler.

Make more sense?

这篇关于jQuery：表单不用$（&＃;＃id）提交submit（），但会用“submit”按钮提交？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！