表单操作onclick而无需使用Ajax刷新

时间:2015-04-30 17:25:10

标签: javascript php jquery ajax

我有一个简单的聊天应用。用户输入用户名和消息,它应该被插入到数据库中。

这个代码没有发生这种情况,显然我遗漏了一些东西:

FORM + SCRIPT

    <form action="chat_s.php" method="post" class="send" id="form1" >
            <p>
                <label for="name">Name:</label>
                <input type="text" name="name" id="name">
            </p>
    <div style="width: 480px; height: 400px; text-align: left;" id="DIV_CHAT">
    </div>
            <p>
    <textarea id="msg" rows="5" cols="66" name="msg" placeholder="Your Message"></textarea></p>
            </p>
    <input class="submit" type="submit" id="button1" name="submit" value="Send" onfocus="this.blur()"  />
    </form>
    <script>
      var frm = $('#form1');
      frm.submit(function (ev) {
          $.ajax({
              type: frm.attr('method'),
              url: frm.attr('action'),
              data: frm.serialize(),
              success: function (data) {
                  alert(data);
              }
          });
          ev.preventDefault();
      });
</script>

这是应该插入用户输入数据库的php文件:

CHAT_S.PHP

<?php
include_once 'connection.php';
if(!isset($_POST['submit'])) {}else
{
$name = mysqli_real_escape_string( $mysqli,$_POST['name']);
$msg = mysqli_real_escape_string($mysqli, $_POST['msg']);
$dt = date("Y-m-d H:i:s");
$sql = "INSERT INTO messages (username, chatdate, msg) VALUES ('$name', '$dt', '$msg')";
mysqli_query($mysqli, $sql); }
$mysqli->close();
?>

但结果却一无所获。它没有提醒!并且它不会在数据库中插入任何内容,只会刷新聊天框:(

1 个答案:

答案 0 :(得分:1)

尝试:

  var frm = $('#form1');
  frm.submit(function (ev) {
      f = $('#form1');
      $.ajax({
          type: f.attr('method'),
          url: f.attr('action'),
          data: f.serialize(),
          success: function (data) {
              alert(data);
          }
      });
      ev.preventDefault();
  });