简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO)
집 > 웹 프론트엔드 > JS 튜토리얼 > 본문

ajax提交form表单到数据库实例

小云云
풀어 주다： 2018-02-23 15:05:21
원래의
5451명이 탐색했습니다.

在静态页面提交表单到数据库很简单就是单纯的
로그인 후 복사

这个缺点是会刷新页面，会跳转页面的。今天给大家带来的技术就是ajax提交表单，优点是不刷新页面，不跳转页面，静默提交的。

首先我们得要有一个表单提交页面：

index.html
这个页面由两个部分组成
1、表单控件
2、jQuery+ajax处理脚本
jQuery脚本会获取form表单的数据，通过post的方式提交给api.php




    login test
로그인 후 복사

下面就是表单接收页面
api.php
该页面其实很简单
就是连接数据库
然后插入数据库
插入数据库的两个值为
title和url

로그인 후 복사

然后我们需要建立好一个数据库
数据库名为test，表名为testdata

下面是数据库截图

ajax提交form表单到数据库实例

到此，本次案例完成。
当然上面的代码只是简单的实现了ajax提交form表单
但是还有很多细节需要优化，例如表单验证，数据加密等，可以自己拓展学习，完善。

相关推荐：

Ajax提交Form表单页面仍会刷新j解决办法

js提交form表单,并传递参数的实现方法

js 提交form表单和设置form表单请求路径的实现方法

위 내용은 ajax提交form表单到数据库实例의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨：
ajax form 数据库
원천：php.cn
이전 기사：js控制文件拖拽及获取拖拽内容 다음 기사：JS常用设计模式
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
최신 이슈
使用 AJAX、PHP 和服务器发送事件从 OpenAI 的 API 流式传输数据 如何使用服务器发送事件(SSE)将数据从上述API流式传输到使用JavaScript和PHP的浏览器客户端？我已经研究这个问题好几个小时了，但我似乎无法弄清楚出了什么问题。作为参考...
에서 2023-11-11 12:03:23
0
1
497
在使用AJAX请求的响应上进行JSON解析时，出现了未捕获的语法错误：意外的令牌'<'，"<br /> 我正在使用datefrom和dateto制作一个下拉菜单，然后显示这些日期之间的日期，但它没有显示，并且我不断在控制台中收到此错误消息。VM652:1UncaughtSyntaxE...
에서 2023-11-01 10:06:57
0
1
269
不离开页面执行PHP 我有一个表单-textarea（名为su）和提交按钮。提交表单后，我需要运行PHP脚本而不刷新/离开页面“echo”或以某种方式在屏幕上打印返回我很确定这可以通过某种ajax请求来...
에서 2023-10-23 19:05:06
0
1
285
JavaScript 允许访问 CSS 自定义属性（也称为 CSS 变量） 如何使用JavaScript（普通或jQuery）获取和设置CSS自定义属性（通过样式表中的var(…)访问的属性）？这是我不成功的尝试：单击按钮会更改通常的font-weight...
에서 2023-10-20 22:42:04
0
2
244
Vue 2 - 关于改变 props 的警告 我开始了https://laracasts.com/series/learning-vue-step-by-step系列。我因以下错误而停止了Vue、Laravel和AJAX课程：...
에서 2023-10-13 10:49:44
0
2
217
관련 주제
더>
인기 추천
인기 튜토리얼
더>
관련 튜토리얼
인기 추천
최신 강좌
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트：공공복지 온라인 PHP 교육，PHP 학습자의 빠른 성장을 도와주세요！