您的位置:首頁技術文章
文章詳情頁

告別AJAX實現無刷新提交表單

瀏覽:431日期:2022-06-02 13:30:26

通常對于無刷新提交表單,我們都是運用ajax實現的。前段時間跟著老大了解到另一種無刷新提交表單的方法?,F在整理出來分享給大家。

第一種:

(html頁面)

復制代碼 代碼如下:
<!DOCTYPE HTML>
<html lang="en-US">
<head>
    <meta charset="utf-8">
    <title>無刷新提交表單</title>
    <style type="text/css">
        ul{ list-style-type:none;}
    </style>
</head>
<body>
    <iframe name="formsubmit">
    </iframe>

    <!-- 將form表單提交的窗口指向隱藏的ifrmae,并通過ifrmae提交數據。 -->
    <form action="form.php" method="POST" name="formphp" target="formsubmit">
       <ul>
            <li>
                <label for="uname">用戶名:</label>
                <input type="text" name="uname" id="uname" />
            </li>
            <li>
                <label for="pwd">密  碼:</label>
                <input type="password" name="pwd" id="pwd" />
            </li>
            <li>
                <input type="submit" value="登錄" />
            </li>
       </ul>
    </form>
</body>
</html>

(PHP頁面)

復制代碼 代碼如下:
<?php
  //非空驗證
  if(empty($_POST["uname"]) || empty($_POST["pwd"]))
  {
    echo "<script type="text/javascript">alert("用戶名或密碼為空!");</script>";
    exit;
  }

  //驗證密碼
  if($_POST["uname"] != "jack" || $_POST["pwd"] != "123456")
  {
    echo "<script type="text/javascript">alert("用戶名或密碼不正確!");</script>";
    exit;
  } else {
    echo "<script type="text/javascript">alert("登錄成功!");</script>";
    exit;
  }

標簽: CSS HTML
相關文章:
国产综合久久一区二区三区