이번에는 Ajax를 사용하여 새로 고치지 않고 양식을 데이터베이스에 제출할 때 몇 가지 주의 사항을 알려드리겠습니다. 다음은 실제 사례를 함께 살펴보겠습니다.
정적 페이지에서 데이터베이스에 양식을 제출하는 것은 매우 간단하다는 점을 누구나 알아야 합니다.
<form action="test.php" method="post"> </form>
이 단점은 페이지가 새로 고쳐지고 페이지가 점프한다는 것입니다.
오늘 제가 가지고 온 기술은 ajax 폼 제출입니다
페이지를 새로고침하지 않고, 페이지로 점프하지 않고, 자동으로 제출된다는 장점이 있습니다.
Ajax가 무엇인지 알아보려면 Baidu에 가서 직접 알아보세요.
먼저 양식 제출 페이지가 있어야 합니다.
index.html
이 페이지는 두 부분으로 구성됩니다
1. 양식 제어
2. jQuery+ajax 처리 스크립트
jQuery 스크립트는 양식 데이터를 가져옵니다. post
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>login test</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> <script type="text/javascript"> function insert() { $.ajax({ type: "POST",//方法 url: "api.php" ,//表单接收url data: $('#form1').serialize(), success: function () { //提交成功的提示词或者其他反馈代码 var result=document.getElementById("success"); result.innerHTML="成功!"; }, error : function() { //提交失败的提示词或者其他反馈代码 var result=document.getElementById("success"); result.innerHTML="失败!"; } }); } </script> </head> <body> <p id="form-p"> <form id="form1" onsubmit="return false" action="##" method="post"> <p><input name="title" id="title" type="text" value="title"/></p> <p><input name="url" id="url" type="text" value="url"/></p> <p><input type="button" value="插入" onclick="insert()"></p> <p><p id="success"></p></p> </form> </p> </body> </html>
를 통해 api.php에 제출되었습니다
<?php $title = $_POST['title']; $url = $_POST['url']; $con = mysql_connect("localhost","root","root"); if (!$con) { die('Could not connect: ' . mysql_error()); } mysql_select_db("test", $con); mysql_query("INSERT INTO testdata (title, url) VALUES ('$title', '$url')"); mysql_close($con); ?>
다음은 양식 수신 페이지입니다
api.php
데이터베이스에 연결데이터를 삽입합니다library
데이터베이스에 삽입합니다. 두 값은
title과 url
rrreee입니다. 그런 다음 데이터베이스를 만들어야 합니다.
데이터베이스 이름은 test이고 테이블 이름은 testdata
다음은 라이브러리의 스크린샷입니다. 데이터베이스
이제 이 사건은 완료되었습니다.
물론, 위의 코드는 단순히 ajax 제출 양식을 구현한 것입니다.
이 기사의 사례를 읽으신 후 해당 방법을 마스터하셨다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!
추천 도서:
Ajax와 폼을 사용하여 등록된 사용자에게 필요한 기능을 구현합니다.
동적 원형 차트 및 세로 막대형 차트를 구현하기 위해 Ajax에 대한 자세한 그래픽 및 텍스트 설명
위 내용은 새로 고치지 않고 Ajax를 사용하여 데이터베이스에 양식 제출의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!