情報があれば教えて頂きたい事があります。
どんな事でも構いませんのでよろしくお願い致します。
最近のBlogでは当たり前の機能になりつつある、入力したタグや
文字をリアルタイムにHTMLでプレビューできるリアルタイム
エディタをPHPで作成しなければならなくなりました。
機能としてはインターネット上のフォームにタグと文字を入力すると
リアルタイムに別ウィンドウで開かれたブラウザで実際に
表示される というものです。
JavaやAjaxの事を調べてみると「非同期通信」を使ってリアルタイムに
データのやり取りをする事になるという点については分かったのですが
フォームに入力されたデータをどのように処理をすると別のウィンドに
リアルタイムに表示できるかという事が分からず困ってしまいました。
単純なサンプルソースや解説をしているサイトがあれば教えて頂き
ますようお願いします。
一応、JavaとPHPのプログラムについての基本処理は理解しています。
A 回答 (1件)
- 最新から表示
- 回答順に表示
No.1
- 回答日時:
私はFCKEditorを扱った物を作成しました。
FCKEditorの中身を色々と変更したりしたのですが、Ajaxは使ってなかったと思います。
また、自前でも記述したHTMLをリアルタイムでプレビューさせるような機能も作成しましたが、それもやはりAjaxは使っていません。
例えば単純にHTMLを表示したい場合、
<script type="text/javascript">
function writeText(str) {
document.getElementById('p').innerHTML = str;
}
</script>
<div id="p"></div>
<input type="text" name="html" value="" onblur="writeText(this.value)">
これだけでもllriverさんの希望の動作として動くことになるんじゃないかな?と思います。
Ajaxを利用したWYSIWYGエディタもあるようなのですが、実際に扱ったことが無いのでどのようにしているかは解りません。
まずはダウンロードしてソースを調べてみると良いのではないかと思います。
参考URLにAjaxを使ってるらしいtinymceというエディタのリンクを張っておきます。
参考URL:http://tinymce.moxiecode.com/index.php
ご回答ありがとうございます。
実はFCKEditorは使ってみた事はあったのですが、
改造という所まで至らなかったのです。
ご回答の中にあるスクリプトだけでも充分参考となりました。
後は表示するタイミングを「キーを押された時」に改造する
事でなんとかなりそうです。
本当にありがとうございます。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- Excel(エクセル) PHPプログラムをエクセルに張り付けると検索ボックスがでてくる! 3 2022/05/08 07:10
- Java java 飾子を付けること(public static・・・) ・コンソールへの出力処理はmainメ 2 2022/06/16 19:34
- PHP PHPで入力フォームでデータを確認表示画面まで送る流れを日本語で理解したいのです。 1 2023/05/29 19:12
- その他(プログラミング・Web制作) 監視カメラを水平につないでパノラマの映像を作りたい 1 2022/09/06 15:26
- JavaScript Javascriptが機能せず原因が分からないので教えて頂きたいです 3 2023/06/04 14:50
- AJAX JavascriptからPHPへのAjax通信でnullが返ってくる 3 2022/08/03 22:00
- JavaScript フォームが空欄の時にフォームの外をクリックすると、エラーが出るコードを調べています。 1 2023/06/25 11:51
- Java javaの質問です 次の機能を有するメソッド4つを自クラスに作成し、実装したいです 【機能】 足し算 1 2022/06/15 17:49
- Java java 次の機能を有するメソッドを自クラスに作成し、実装したいです。 機能 名前判定機能 →名前が 3 2022/06/16 16:08
- JavaScript 空白で入力フォームのボタンをクリックしたら、ブラウザの上部からjavascriptで 表示されるアラ 1 2022/05/20 11:16
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
onClickとsubmitの処理順序
-
javascriptで入力禁止文字をチ...
-
dijit.form.ComboBoxについて
-
イベント発生時に入力待ち状態...
-
テキストボックスを無効にする...
-
AjaxのWYSIWYGエディタ
-
return trueとreturn falseの用...
-
プルダウン選択を変更すると、...
-
slickのレスポンシブ > center...
-
FormのonsubmitでJavaスクリプ...
-
onchangeイベントを強制的に発...
-
submitがおされた同時に JavaSc...
-
select要素のvalueを配列で取得...
-
Selectボックスの幅を自動で広...
-
HTMLファイル同士での値渡し
-
ラジオボタンの値でリンク先を...
-
ラジオボタンとプルダウンを連...
-
Selectの中身をfor文で入れる
-
JQuery selectが反映されない
-
確認ページからフォームページ...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
onClickとsubmitの処理順序
-
JSPとJavaScriptの連携について...
-
ラジオボタンによるフォームの...
-
テキストボックス入力を半角英...
-
onChange()メソッド
-
フォームから入力すると、入力...
-
テキストボックスを無効にする...
-
フォームの値が0だったら空白...
-
文末の改行コードを削除したい
-
キーボードの数字のキーだけを...
-
テキストボックスのグレーアウト
-
javaでフォーム入力の確認と文...
-
フィールドを有効(enabled?)に...
-
JavaScript のプログラム質問で...
-
Javascript 郵便番号の入力欄で...
-
イベント発生時に入力待ち状態...
-
フォームのテキストをリンク化...
-
貼り付けイベントで値を取得したい
-
メールフォームの入力確認用Jav...
-
dijit.form.ComboBoxについて
おすすめ情報