ajax提交form表單到資料庫 無重新整理

2021-08-15 15:55:42 字數 990 閱讀 5805

在靜態頁面提交表單到資料庫很簡單就是單純的

這個缺點是會重新整理頁面,會跳轉頁面的。

今天給大家帶來的技術就是ajax提交表單

優點是不重新整理頁面,不跳轉頁面,靜默提交的。

首先我們得要有乙個表單提交頁面:

index.html

這個頁面由兩個部分組成

1、表單控制項

2、jquery+ajax處理指令碼

jquery指令碼會獲取form表單的資料,通過post的方式提交給api.php

下面就是表單接收頁面

api.php

該頁面其實很簡單

就是連線資料庫

然後插入資料庫

插入資料庫的兩個值為

title和url

<?php 

$title = $_post['title'];

$url = $_post['url'];

$con = mysql_connect("localhost","root","root");

if (!$con)

mysql_select_db("test", $con);

mysql_query("insert into testdata (title, url)

values ('$title', '$url')");

mysql_close($con);

?>

然後我們需要建立好乙個資料庫

資料庫名為test,表名為testdata

下面是資料庫截圖

到此,本次案例完成。

當然上面的**只是簡單的實現了ajax提交form表單

但是還有很多細節需要優化,例如表單驗證,資料加密等,可以自己拓展學習,完善。

Ajax提交form表單

ajax提交form表單 高校平台專案中採用的ui框架為dwz框架,這個框架有乙個很靈活又很讓人頭疼的問題,那就是它的div碎片。所謂的div碎片指的是每乙個jsp頁面不再是乙個單純的jsp了,此時的jsp只不過是乙個div,通過dwz框架本身的ajax技術,可以將任何乙個jsp作為乙個div嵌入到...

ajax實現form表單提交

最終整理了一下 能夠完美實現要求。不重新整理提交表單,只提交一次,中文不亂嗎。html 部分 form input type text name link name id link name placeholder 如 言曌部落格 required required input type text ...

ajax提交整個form表單

在專案開發中,有時提交form表單時不能單單用action或者jquery的 表單提交方法有三種,主要說下第三種 第一種 用form自帶屬性action提交 第二種 用jquery提交 formid submit 第三種 用ajax提交 但如果form表單中資料很多時,不可能一一列出,只需要用 yo...