ajax提交form表單到數據庫(無刷新)

荊兆峰發布于2019-08-26 11:45 / 2729人閱讀

摘要：在靜態頁面提交表單到數據庫很簡單就是單純的這個缺點是會刷新頁面，會跳轉頁面的。當然上面的代碼只是簡單的實現了提交表單但是還有很多細節需要優化，例如表單驗證，數據加密等，可以自己拓展學習，完善。

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

這個缺點是會刷新頁面，會跳轉頁面的。
今天給大家帶來的技術就是ajax提交表單

優點是不刷新頁面，不跳轉頁面，靜默提交的。
至于什么是ajax，自己去百度了解。

首先我們得要有一個表單提交頁面：

index.html
這個頁面由兩個部分組成
1、表單控件
2、jQuery+ajax處理腳本
jQuery腳本會獲取form表單的數據，通過post的方式提交給api.php




    login test

下面就是表單接收頁面
api.php
該頁面其實很簡單
就是連接數據庫
然后插入數據庫
插入數據庫的兩個值為
title和url

然后我們需要建立好一個數據庫
數據庫名為test，表名為testdata

下面是數據庫截圖

到此，本次案例完成。
當然上面的代碼只是簡單的實現了ajax提交form表單
但是還有很多細節需要優化，例如表單驗證，數據加密等，可以自己拓展學習，完善。
本文由里客云資源站原創：http://www.likeyunba.com
轉載請附上原鏈接，加入技術交流群請加微信:likeyunba520

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/107492.html

ajax提交form表單到數據庫(無刷新)

摘要：在靜態頁面提交表單到數據庫很簡單就是單純的這個缺點是會刷新頁面，會跳轉頁面的。當然上面的代碼只是簡單的實現了提交表單但是還有很多細節需要優化，例如表單驗證，數據加密等，可以自己拓展學習，完善。在靜態頁面提交表單到數據庫很簡單就是單純的這個缺點是會刷新頁面，會跳轉頁面的。今天給大家帶來的技術就是ajax提交表單優點是不刷新頁面，不跳轉頁面，靜默提交的。至于什么是ajax，自己去百度...

2i18ns 2019-06-28 18:25 評論0 收藏0
web端文件上傳功能的思考

摘要：概述文件上傳是一個很常見的需求，實現文件上傳的技術也很多。幫助文檔模擬無刷新的文件上傳功能頁面無刷新上傳文件模擬，超簡單為什么上傳文件的表單里要加個屬性接口對象的介紹使用對象涉及文章侵權，請郵件告知。概述文件上傳是一個很常見的需求，實現文件上傳的技術也很多。下面就談談一些常見的上傳技術以及它們的優劣。傳統表單上傳傳統表單文件上傳估計是運用最廣泛和最簡單的技術了，說它簡單是...

Jaden 2019-08-21 12:35 評論0 收藏0
PHP_Ajax

摘要：簡介業務做一個在線投票，給歌手投票。提交到當前頁面的中達到效果。用戶名密碼注冊總結在不使用對象的情況下，依然可以用來實現對后臺服務器的請求，同時不帶來頁面刷新或者跳轉。 ajax 簡介業務：做一個在線投票，給歌手投票。要求：無刷新，并且不允許使用XMLHttpRequest對象.分析:在XHR對象，沒有流行之前，已經有了無刷新這種效果的方法. 從http角度看，可以利用204 No...

MiracleWong 2019-06-27 15:05 評論0 收藏0
【面試篇】JS基礎知識查漏補缺

摘要：因為在頁面加載完成后，引擎維護著兩個隊列，一個是按頁面順序加載的執行隊列，還有一個空閑隊列，使用定時函數就是將回調函數加入到空閑隊列中，故和其他定時器是并發執行的。 1.window.onload和$(document).ready()的區別： ①執行時間：window.onload會在所有元素，包括圖片,引用文件加載完成之后執行，而$(document).ready()則會在HTML...

myeveryheart 2019-08-20 16:02 評論0 收藏0
yii2 modal彈窗之ActiveForm ajax表單異步驗證

摘要：順便再叨嘮一句，確實沒啥好說了。后面若是有我再把話改回來。中，默認做了客戶端驗證，但是表單的提交，卻不是無刷新的。也就是常常看到的表單提交后頁面會刷新。關于我們做一個說明。作者：白狼出處：http://www.manks.top/yii2_modal_activeform_ajax.html 本文版權歸作者，歡迎轉載，但未經作者同意必須保留此段聲明，且在文章頁面明顯位置給出原文連接...

youkede 2019-06-27 13:55 評論0 收藏0