Question

我正在使用Ajax和jQuery来获取提交按钮的点击事件

的输出

我有两个文件

Index.php（包含jQuery和Ajax代码）
actionfile.php（一个php文件，用于提取Index.php中Ajax代码发送的数据，并将数据存储在文件中）

的index.php：

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>

</head>
<body>

<form name="myform" method="post">
<input type="text" name="txt1" id="txt1" value="121212"/>
<input type="submit" value="submit" id="submit" name="submit" />
</form>

<script> 
$("#submit").click(function() {
    var txt =document.getElementById('txt1').value;  //textbox value
    alert(txt);
    var txt1 = "txt1="+txt;
    alert(txt1);
    $.ajax({
            type: "POST",
            url: "actionfile.php",
            data:txt1,
            success: function() {
               alert("success");
            }
        });
    });
</script>
</body>

</html>

and actionfile.php：

<?php
    error_reporting(E_ALL);
    $map=$_POST['txt1'];
    $fp=fopen("file.txt","w");
    fwrite($fp,$map);
    fclose($fp);
?>

问题是，如果我删除了一段代码$("#submit").click(function()，ajax工作正常，这意味着它在页面加载时提交数据（假设我在文本框中给出了默认值）。当我保持代码$("#submit").click(function()不变时，只有在按下提交按钮时才调用该函数，但在这种情况下AJAX失败。

代码可在http://www.code.guru99.com/kishore

导致此问题的原因是什么？

Answer 1

试试这个：

    $("form").submit(function(e){
        e.preventDefault();

        var txt =document.getElementById('txt1').value;  //textbox value
        alert(txt);
        var txt1 = "txt1="+txt;
        alert(txt1);
        $.ajax({
                type: "POST",
                url: "actionfile.php",
                data:txt1,
                success: function() {
                   alert("success");

                   //here you can simulate click submit
                }
            });
        });
      });

Answer 2

只需将类型表单submit更改为button：

即可

<input type="button" value="submit" id="submit" name="submit" />

Answer 3

使用像这样：

将提交更改为按钮。

      <form name="myform" method="post">
      <input type="text" name="txt1" id="txt1" value="121212"/>
      <input type="button" value="submit" id="submit" name="submit" onclick="test();" />


<script> 
       function test()
 { 
var txt =document.getElementById('txt1').value;  //textbox value
alert(txt);
var txt1 = "txt1="+txt;
alert(txt1);
$.ajax({
        type: "POST",
        url: "actionfile.php",
        data:txt1,
        success: function() {
           alert("success");
        }
    });
 }
</script>

希望这会给你一些解决方案。

Answer 4

您删除$("#submit").click(function()时代码有效，因为您的<form>已发布并且数据已发送。

要让AJAX提交数据，您需要使用type="button"，或将您的活动更改为：

$("#submit").click(function(e) {
    e.preventDefault();

我怎样才能停止onload事件？

4 个答案: