Ajaxとmysqlのデータ連携で実装した掲示板機能の例を詳しく解説
この記事では主に、掲示板機能を実現するための Ajax と MySQL のデータ対話の詳細な例を紹介します。最近、Ajax と MySQL の間のデータ対話を実現するための小さなデモを作成しました。js 部分は jq で、バックグラウンドは PHP です。 、データベースは mysql です。後で、node+MongoDB バージョンが登場します。
mysql の使用とインストールについては詳しく説明しません。Baidu xampp、Apache サーバー、mysql データベースを統合しました。これは非常に使いやすいです。
まず、「イレブン」を構築します。 " ここに次のようにデータベースを作成しました。 microblog というテーブルを作成しました (注意: ここでは mysql の上位バージョンを使用しており、PHP データベース接続メソッドは mysqli_ を使用しています。バージョンが低すぎる場合は、mysql_ メソッドを使用してコードを修正してください)自分自身)
以下はコードです 部分:
html ページと js 部分:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>微博留言板</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
#box{
width: 600px;
/*height: 500px;*/
border: 2px solid rgb(85,85,85);
border-radius: 15px;
margin: 50px auto;
padding: 20px 10px 15px;
background-color: rgb(85,85,85);
}
#content{
display: block;
resize: none;
width: 550px;
height: 200px;
margin: 0 auto;
border: 2px solid rgb(225,225,225);
border-radius: 10px;
text-align: center;
font-size: 30px;
background-color: rgb(225,225,225);
}
#content:focus{
outline: none;
border: 2px solid rgb(225,225,225);
box-shadow: 0 0 15px rgb(225,225,225);
}
#btn{
border: 2px solid rgb(255,204,0);
width: 80px;
height: 40px;
border-radius: 5px;
margin-top: 30px;
font-size: 17px;
cursor: pointer;
outline: none;
background-color: rgb(255,204,0);
}
.list{
list-style: none;
background-color: rgb(249,249,249);
margin-top: 20px;
}
.list>li{
padding: 20px 10px 10px;
border-bottom: 2px solid rgb(68,68,68);
font-size: 20px;
color: rgb(200,214,225);
position: relative;
word-break: break-word;
word-wrap: break-word;
background-color: rgb(85,85,85);
}
.list>li>.control{
position: absolute;
bottom: 3px;
right: 5px;
font-size: 14px;
}
.list>li>p{
margin-bottom: 25px;
}
.control span,.control em{
display: inline-block;
margin-right: 15px;
}
.control em{
color: darkblue;
cursor: pointer;
}
a{
text-decoration: none;
color: darkred;
}
#page>a{
display:inline-block;
width: 40px;
height: 30px;
margin-top: 10px;
text-align: center;
line-height: 30px;
font-size: 20px;
border-radius: 5px;
color: white;
background-color: rgb(51,21,70);
}
#head{
color: rgb(200,214,225);
font-size: 30px;
height: 50px;
border-bottom: 2px solid rgb(68,68,68);
margin-bottom: 20px;
}
</style>
</head>
<body>
<p id="box">
<p id="head">
留言板
</p>
<p id="fill_in">
<textarea id="content"></textarea>
<button id="btn">提交留言</button>
</p>
<!--留言列表-->
<p id="message_text">
<ul class="list">
</ul>
</p>
<!--分页-->
<p id="page">
<a href="javasript:void(0)">1</a>
<a href="javasript:void(0)">2</a>
</p>
</p>
</body>
<script src="Jq/jquery-3.1.1.min.js"></script>
<script type="text/javascript">
$(function(){
$("#btn").on("click",function(){
if ($("#content").val() == "") {
alert("~~客官，说一句再走呗~~関連する推奨事項:
WeChat アプレット wx.request はバックグラウンド データを実現します相互作用関数分析
以上がAjaxとmysqlのデータ連携で実装した掲示板機能の例を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
ホットAIツール
Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ
AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。
Undress AI Tool
脱衣画像を無料で
Clothoff.io
AI衣類リムーバー
AI Hentai Generator
AIヘンタイを無料で生成します。
人気の記事
ホットツール
メモ帳++7.3.1
使いやすく無料のコードエディター
SublimeText3 中国語版
中国語版、とても使いやすい
ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境
ドリームウィーバー CS6
ビジュアル Web 開発ツール
SublimeText3 Mac版
神レベルのコード編集ソフト（SublimeText3）
ホットトピック
7533
15
1379
52
82
11
21
86
MySQL：簡単な学習のためのシンプルな概念
Apr 10, 2025 am 09:29 AM
MySQLは、オープンソースのリレーショナルデータベース管理システムです。 1）データベースとテーブルの作成：createdatabaseおよびcreateTableコマンドを使用します。 2）基本操作：挿入、更新、削除、選択。 3）高度な操作：参加、サブクエリ、トランザクション処理。 4）デバッグスキル：構文、データ型、およびアクセス許可を確認します。 5）最適化の提案：インデックスを使用し、選択*を避け、トランザクションを使用します。
phpmyadminを開く方法
Apr 10, 2025 pm 10:51 PM
次の手順でphpmyadminを開くことができます。1。ウェブサイトコントロールパネルにログインします。 2。phpmyadminアイコンを見つけてクリックします。 3。MySQL資格情報を入力します。 4.「ログイン」をクリックします。
Navicatプレミアムの作成方法
Apr 09, 2025 am 07:09 AM
NAVICATプレミアムを使用してデータベースを作成します。データベースサーバーに接続し、接続パラメーターを入力します。サーバーを右クリックして、[データベースの作成]を選択します。新しいデータベースの名前と指定された文字セットと照合を入力します。新しいデータベースに接続し、オブジェクトブラウザにテーブルを作成します。テーブルを右クリックして、データを挿入してデータを挿入します。
MySQL：世界で最も人気のあるデータベースの紹介
Apr 12, 2025 am 12:18 AM
MySQLはオープンソースのリレーショナルデータベース管理システムであり、主にデータを迅速かつ確実に保存および取得するために使用されます。その実用的な原則には、クライアントリクエスト、クエリ解像度、クエリの実行、返品結果が含まれます。使用法の例には、テーブルの作成、データの挿入とクエリ、および参加操作などの高度な機能が含まれます。一般的なエラーには、SQL構文、データ型、およびアクセス許可、および最適化の提案には、インデックスの使用、最適化されたクエリ、およびテーブルの分割が含まれます。
NavicatでMySQLへの新しい接続を作成する方法
Apr 09, 2025 am 07:21 AM
手順に従って、NAVICATで新しいMySQL接続を作成できます。アプリケーションを開き、新しい接続（CTRL N）を選択します。接続タイプとして「mysql」を選択します。ホスト名/IPアドレス、ポート、ユーザー名、およびパスワードを入力します。 （オプション）Advanced Optionsを構成します。接続を保存して、接続名を入力します。
なぜMySQLを使用するのですか？利点と利点
Apr 12, 2025 am 12:17 AM
MySQLは、そのパフォーマンス、信頼性、使いやすさ、コミュニティサポートに選択されています。 1.MYSQLは、複数のデータ型と高度なクエリ操作をサポートし、効率的なデータストレージおよび検索機能を提供します。 2.クライアントサーバーアーキテクチャと複数のストレージエンジンを採用して、トランザクションとクエリの最適化をサポートします。 3.使いやすく、さまざまなオペレーティングシステムとプログラミング言語をサポートしています。 4.強力なコミュニティサポートを提供し、豊富なリソースとソリューションを提供します。
単一のスレッドレディスの使用方法
Apr 10, 2025 pm 07:12 PM
Redisは、単一のスレッドアーキテクチャを使用して、高性能、シンプルさ、一貫性を提供します。 I/Oマルチプレックス、イベントループ、ノンブロッキングI/O、共有メモリを使用して同時性を向上させますが、並行性の制限、単一の障害、および書き込み集約型のワークロードには適していません。
MySQLおよびSQL：開発者にとって不可欠なスキル
Apr 10, 2025 am 09:30 AM
MySQLとSQLは、開発者にとって不可欠なスキルです。 1.MYSQLはオープンソースのリレーショナルデータベース管理システムであり、SQLはデータベースの管理と操作に使用される標準言語です。 2.MYSQLは、効率的なデータストレージと検索機能を介して複数のストレージエンジンをサポートし、SQLは簡単なステートメントを通じて複雑なデータ操作を完了します。 3.使用の例には、条件によるフィルタリングやソートなどの基本的なクエリと高度なクエリが含まれます。 4.一般的なエラーには、SQLステートメントをチェックして説明コマンドを使用することで最適化できる構文エラーとパフォーマンスの問題が含まれます。 5.パフォーマンス最適化手法には、インデックスの使用、フルテーブルスキャンの回避、参加操作の最適化、コードの読み取り可能性の向上が含まれます。
