Question

我无法理解为什么我的JQuery无法运行。数据可以很好地更新到数据库，但是我没有在跨区中收到消息，而是进入了一个新页面，其中显示了＆＃34; Insert Succesfull＆＃34;。任何人都可以看到有什么问题吗？

请远离oldschool连接等： - ）

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="js/my_script.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="css\placing.css">
    <title>Numbers</title>
</head>

<body>
    <div class="topbar">
        sf
    </div>


    <div class="talraekke">
        <p>test</p>
    </div>

    <div class="content">
        <p>Enter The Number</p>
        <form id="myForm" action="userInfo.php" method="post">
            <input type="value" name="numbervalue">
            <button id="sub">Save</button>
        </form>
        <span id="result"></span>
    </div>

PHP：

<?php

include('connection.php');


// Insert To Database
$strSQL = "INSERT INTO numbertable(numbers) VALUES('" . $_POST["numbervalue"] . "')";


        if(mysql_query("INSERT INTO numbertable VALUES('numbers')"))
            echo "Insert Succesfull";
        else
            echo "Failed";


// The SQL statement is executed 
    mysql_query($strSQL) or die (mysql_error());

// Close the database connection
    mysql_close();

?>

JS：

$("#sub").click( function() {
 $.post( $("#myForm").attr("action"), 
         $("#myForm :input").serializeArray(), 
         function(info){ $("#result").html(info); 
   });
 clearInput();
});

$("#myForm").submit( function() {
  return false; 
});

function clearInput() {
    $("#myForm :input").each( function() {
       $(this).val('');
    });
}

Answer 1

试试这个：

$("#sub").click( function(e) { // note the 'e'
   e.preventDefault(); // remove default action(submitting the form)
   $.post( $("#myForm").attr("action"), 
     $("#myForm :input").serializeArray(), 
     function(info){ $("#result").html(info); 
   });
   clearInput();
});

Answer 2

 <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

        <link rel="stylesheet" type="text/css" href="css\placing.css">
        <title>Numbers</title>
    </head>

    <body>
        <div class="topbar">
            sf
        </div>


        <div class="talraekke">
            <p>test</p>
        </div>

        <div class="content">
            <p>Enter The Number</p>
            <form id="myForm" action="userInfo.php" method="post">
                <input type="value" name="numbervalue">
                <button id="sub">Save</button>
            </form>
            <span id="result"></span>
        </div>

    <script src="js/my_script.js" type="text/javascript"></script>
<script>
function clearInput() {
    $("#myForm :input").each( function() {
         $(this).val('');
    });
}

    $(document).ready(function(){
         //you can put here the function that Philip wrote
         $("#sub").click( function(e) { // note the 'e'
       e.preventDefault(); // remove default action(submitting the form)
       $.post( $("#myForm").attr("action"), 
         $("#myForm :input").serializeArray(), 
         function(info){ $("#result").html(info); 
       });
       clearInput();
    });
    })
    </script>
    </body>

JQuery很有用

2 个答案: