Jquery两次插入mysql

Question

I have been trying to create a web-based stopwatch in which the value of start time and stop time will be stored into mysql. The stopwatch is created in javascript, and I use jquery to store it to mysql. The problem is whenever I click 'Stop'on my stopwatch, the value is inserted twice in mysql while it should only be inserted once. Here's my code snippet :

function stopTimers() {
  clearInterval(_myTimer_ms);
  clearInterval(_myTimer_s);
  clearInterval(_myTimer_m);
  clearInterval(_myTimer_h);

  $(document).ready(function(){
    //Get the input data using the post method when Push into mysql is clicked .. we pull it using the id fields of ID, Name and Email respectively...
    $("#stop").click(function(){
      //Get values of the input fields and store it into the variables.
      var cell=$("#cell").val();
      var machine=$("#machine").val();
      var hour=$("#hour").val();
      var tmin=$("#tmin").val();
      var sec=$("#sec").val();
      var mssec=$("#mssec").val();    

      //use the $.post() method to call insert.php file.. this is the ajax request
      $.post('insert.php', {cell: cell,machine: machine,hour: hour,tmin : tmin,sec: sec,mssec: mssec},
        function(data){
          $("#message").html(data);
          $("#message").hide();
          $("#message").fadeIn(100); //Fade in the data given by the insert.php file
        }
      );
      return false;
    });
  });    
}

and here's my insert.php code :

<?php
//Configure and Connect to the Databse
 $con = mysql_connect("localhost","diki","diki");
 if (!$con) {
 die('Could not connect: ' . mysql_error());
 }
 mysql_select_db("diki", $con);
 //Pull data from home.php front-end page
 $my_date = date("Y-m-d H:i:s");
 //$my_time =
 $cell=$_POST['cell'];
 $machine=$_POST['machine'];
 $hour=$_POST['hour'];
 $tmin=$_POST['tmin'];
 $sec=$_POST['sec'];
 $mssec=$_POST['mssec'];

 //Insert Data into mysql
$query=mysql_query("INSERT INTO diki02(cell,machine,hour,tmin,sec,mssec,date,Stoptime) VALUES('$cell','$machine','$hour','$tmin','$sec','$mssec','$my_date',NOW())");
if($query){
echo "Data for $cell and $machine inserted successfully!";
}
else{ echo "An error occurred!"; }
?>

Still figuring out why it's inserted twice,, anybody ever encountered the same problem ?

THankss

Answer 1

Try this script block

'removed $(document).ready(function(){}); ' Block

//Get the input data using the post method when Push into mysql is clicked .. we pull it using the id fields of ID, Name and Email respectively...
                $("#stop").click(function () {

                    clearInterval(_myTimer_ms);
                    clearInterval(_myTimer_s);
                    clearInterval(_myTimer_m);
                    clearInterval(_myTimer_h);
                    //Get values of the input fields and store it into the variables.
                    var cell = $("#cell").val();
                    var machine = $("#machine").val();
                    var hour = $("#hour").val();
                    var tmin = $("#tmin").val();
                    var sec = $("#sec").val();
                    var mssec = $("#mssec").val();



                    //use the $.post() method to call insert.php file.. this is the ajax request
                    $.post('insert.php', { cell: cell, machine: machine, hour: hour, tmin: tmin, sec: sec, mssec: mssec },
                    function (data) {
                        $("#message").html(data);
                        $("#message").hide();
                        $("#message").fadeIn(100); //Fade in the data given by the insert.php file
                    });
                    return false;
                });