Question

我是jquery和Ajax的新手。我想用jquery将参数发送到带有ajax的数据库。

  $(document).ready(function(){ 
$("#btnajax1").click(function(){
$("form").submit(function(event){
//event.preventDefault();
var user = $("input#tfuser").val();
var pass = $("input#tfpass").val();
if(!user)
{
    alert("user");
}
else if(!pass)
{

    alert("pass");
}
else
{
    $.post("files/forms.php",{username:user,password:pass},function(data)//line 36
    { 
        if(data == '1') alert("sabt shod");//line 40 
        else if(data == 0) alert("sabt nashod")//line 41


 else alert("can not connect"); //line 42
    })
}
return false;
    })
    })
}
);

在另一个页面我有html文件：

 <form id="form" action="#">
  <label>
  <input type="submit" name="Submit" value="Submit" />
  </label>
  <label>
  user
  <input name="tfuser" type="text" id="tfuser" />
<p>
  <label>
  pass
  <input name="tfpass" type="text" id="tfpass" />
  </label>
</p>
<p>
  <label>
  <input name="btnajax1" type="submit" id="btnajax1" value="ajax user,pass" />
  </label>

</p>
<div id="result"> </div>
<p>&nbsp; </p>
</form>
</body>
</html>

当我点击40,41,42行的ajax1按钮时必须运行。我的问题是任何提到的行都没有运行。什么是问题（我确定line36正在运行）？

Answer 1

试试这样：

$(document).ready(function() { 
    $('#form').submit(function(event) {
        var user = $("input#tfuser").val();
        var pass = $("input#tfpass").val();
        if(!user) {
            alert("user");
        }
        else if(!pass) {
            alert("pass");
        }
        else {
            $.post('files/forms.php', { username: user, password: pass }, function(data) { 
                if (data == '1') {
                    alert("sabt shod");
                }
                else if (data == '0') {
                    alert("sabt nashod");
                }
                else {
                    alert("can not connect");
                }
            });
        }
        return false;
    });
});

您无需订阅该按钮的.click事件和表单的.submit事件。第二个就足够了。此外，当您在成功回调中测试服务器中的data值时，您应该将其与服务器返回的正确类型进行比较，而不是使用整数一次并将第二个if串起来。

Answer 2

我会做Darin建议的几乎所有内容，但我会抓住点击，这样我就可以劫持事件并停止表单提交。

$(document).ready(function() { 
    $("#btnajax1').click(function(event) {
        event.preventDefault();
        // you can also do a event.stopPropagation() if needed
        var user = $("input#tfuser").val();
        var pass = $("input#tfpass").val();
        if(!user) {
            alert("user");
        }
        else if(!pass) {
            alert("pass");
        }
        else {
            $.post('files/forms.php',{ username:user, password: pass},function(data) { 
                if(data == '1') {
                    alert("sabt shod");
                }
                else if(data == '0') {
                    alert("sabt nashod");
                }
                else {
                    alert("can not connect");
                }
            });
        }
        return false;
    });
});

此外，您可以将提交更改为默认情况下不提交表单的按钮：

<input name="btnajax1" type="button" id="btnajax1" value="ajax user,pass" />

执行此代码的问题

2 个答案: