Question

我可能错过了一些简单的事情。此页面上的JQuery无法运行。这很明显，因为警报不会执行。我只是提交表单而不刷新页面。另外，我没有收到控制台错误。提前谢谢。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
    $(document).ready(function(e) {
       $('submitpicks').on('submit','#submitpicks',function(e){
            e.preventDefault();  //this will prevent reloading page
            alert('Form submitted Without Reloading');
       });
    });

</script>
</head>

<body>
<form name="submitpicks" id="submitpicks" action="" method="post">
<script type="">
var v=0;
function acceptpick(thepick,removepick){
    var userPick = confirm("You picked " + thepick + ". Accept this pick?");
    //var theid = "finalpick" + v;
    var removebtn = "btn" + removepick;
    //alert(theid);
    if(userPick==1){
        document.getElementById("finalpick").value=removepick;
        document.getElementById(removebtn).disabled = true;
        document.getElementById("submitpicks").submit();
        v=v+1;
    }
}
</script>
<?php
include "Connections/myconn.php";
//$setid = $_SESSION["gbsid"];
$setid = 11;
$setqry = "Select * from grabBagParticipants where gbsid = $setid order by rand()";
$setresult = mysqli_query($conn, $setqry);
$u=0;
if(mysqli_num_rows($setresult)>0){
    while($setrow = mysqli_fetch_array($setresult)){
        //shuffle($setrow);
        echo '<input type="button" name="' . $setrow["gbpid"] . '" id="btn' . $setrow["gbpid"] . '" value="' . $u . '" onClick=\'acceptpick("' . $setrow["gbpname"] . '", ' . $setrow["gbpid"] . ');\' /><br />';
        $u=$u+1;
    }
}
?>
<input type="text" name="finalpick" id="finalpick" />
<input type="submit" value="Save" />
</form>
<div id="results">&nbsp;</div>
</body>
</html>

Answer 1

   <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
    $(document).ready(function(e) {
       $('#submitpicks').on('submit',function(e){
            e.preventDefault();  //this will prevent reloading page
            alert('Form submitted Without Reloading');
       });
    });

</script>
</head>

<body>
<form name="submitpicks" id="submitpicks" action="test.php" method="post">
<script type="">
var v=0;
function acceptpick(thepick,removepick){
    var userPick = confirm("You picked " + thepick + ". Accept this pick?");
    //var theid = "finalpick" + v;
    var removebtn = "btn" + removepick;
    //alert(theid);
    if(userPick==1){
        document.getElementById("finalpick").value=removepick;
        document.getElementById(removebtn).disabled = true;
        document.getElementById("submitpicks").submit();
        v=v+1;
    }
}
</script>
<input type="text" name="finalpick" id="finalpick" />
<input type="submit" value="Save" />
</form>
<div id="results">&nbsp;</div>
</body>
</html>

Answer 2

这应该可以解决您的问题。 Fyi，只是在这里做JS而不考虑没有错误的人正在出现。

<html>
<head>
  <meta charset="utf-8">
  <title>Untitled Document</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
  <script>
    $(document).ready(function(e) {
      $('#submitpicks').submit(function(e) {
        e.preventDefault();
        alert('Form Submitted without reloading.');
      })
    });

  </script>
</head>
<body>

<form name="submitpicks" id="submitpicks" action="" method="post">

  <input type="text" name="finalpick" id="finalpick" />
  <input type="submit" value="Save" />
</form>
</body>

JQuery不会运行提交表单

2 个答案: