jQuery・Javascript jQueryを使った小技やAjax非同期通信などについて

Jquery+PHPで簡易チャットを作る

2014年3月7日
この記事は掲載から1180日経過しています。
情報が古い可能性が有りますのでご了承下さい

こちらで新しいjQueryチャットの記事を書きました。宜しければどうぞ!

パソコンを始めた当時はWEBチャットが盛んで、毎夜遅くまで遊んでいました。最近はSNSやLINE、Skypeなどが有りますので、もうそう需要は無いと思うのですが、ちょっと作ってみました。

サンプル
ダウンロード date/chat.logのパーミッションを777へ

今回作成したものは、どちらかと言うとスマートフォン向けになっています。LINEやSkypeと同じように、下部に投稿フォームが有り、ログが下へ埋まっていくスタイルです。HTML上で動きますので、デザインなどはご自由にどうぞ。

chat.js

やることは

  1. 名前を送信したときにクッキーに記録し、管理人メッセージをログに記録
  2. チャットを送信したときにログに記録し、ログをリロード *setTimeout
  3. 指定秒数でログをリロード
  4. イベント発生時にログ表示部分を最下部まで移動させる

こんな感じです。当初は投稿時に単純に<li>へ要素を追加していけばいいや!と思っていたのですが、チャットなので複数人利用を考えると、やはりログのリロードが必要ですよね。ですので、イベント発生時には全ログで書き変えています。

log.php

特に変わった事はしていません。送信されたチャットをchat.logに記録したり、全ログを取り出したりしつつ、XMLファイルとして書き出しています。

リロードをもう少し何とかしたいのですが、方法は無いんでしょうかね・・・投稿時に閲覧してる人にプッシュ・・って訳にはいきませんし。

  • このエントリーをはてなブックマークに追加
  • LINEで送る

このカテゴリーのその他の記事

PAGE TOP