• ベストアンサー

TEXTAREAにワードパッド風の簡易編集機能

n_breakdownの回答

  • ベストアンサー
回答No.3

完全にその機能だけ組み込みになりますが、オープンソース等のWEBエディターなら、下記のサイトが参考になると思います。 http://www.geniisoft.com/showcase.nsf/WebEditors > 何かフリーのJavaScriptライブラリなどをご存知でしたら教えていただけませんでしょうか。 簡単なものなら、js_quicktags.jsがあります。これなら、textareaならどこでも簡単に導入できます。 http://www.alexking.org/index.php?content=software/javascript/content.php

参考URL：
http://www.alexking.org/index.php?content=software/javascript/content.php
Koji001
質問者

お礼

ありがとうございます。 英語が苦手な私にはなんとも難解ですが、 私が欲しかった情報です。 なんとか自力で組み込んでみようと思います。 ありがとうございました。

この回答がついた質問に戻る
回答 全件
> 何かフリーのJavaScriptライブラリなどをご存知でしたら教え…
例えば、こんな感じでボタンを押した時にタグの挿入（選択した部分やカーソ…
  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. HTML

関連するQ&A

  • textareaへの入力支援機能（ボタン）[Javascript]

    textareaへの入力支援機能（ボタン）[Javascript] 他の方が質問されていた件への回答についてのですが、 http://okwave.jp/qa/q2097862.html ANo.3の方の回答を参考にブログにあるようなテキストエリアへの入力支援機能を作成しています。 javascriptはあまり詳しくないので、まず丸々コピーをして テストを行っていたのですが、FIREFOXだと正常に動きますが、 IEの場合、テキストを選択せずにボタンを押すとボタン内に直接タグが追加されてしまいます。 テキストを選択した状態ですと正常に動作するようです。 テキストを選択しなくてもタグが挿入されるか、テキストを選択していない場合はタグが挿入されないようにしたいのです。 色々いじってみたのですが、思うように動かすことができませんでした。。 詳しい方、対処方法がわかる方がいらっしゃったらぜひ教えていただけないでしょうか。 宜しくおねがいします。

  • textareaに文字列を追加する方法

    JavaScript超初心者です。初めて質問します。 2つのテキストエリアに入力されたものを、3つ目のテキストエリアに文字を追加して、入力するスクリプトを作ろうとしています。 ネットで似たようなものを見つけてきて、アレンジしてみたのですが、2つ目の文字を入力するためのボタンをクリックすると、1つ目の文字が消えてしまいます。 姓：AAA/名：BBB と続けて追加されるようにするには、どうしたらよいのでしょうか？ どなたかお助けください。よろしくお願いいたします。 ＜作成中のページ＞ <html> <head> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <title></title> <script language="JavaScript"><!-- function setData() { txt1= document.form7.t1.value; document.form7.list.value = "姓："+ txt1; } function setData1() { txt2= document.form7.t2.value; document.form7.list.value = "名："+ txt2; } // --></script> </head> <body> <form name="form7"> 姓<TEXTAREA name="t1" size="10" rows="1"></TEXTAREA><input type="button" value="済" onClick=setData()><br> 名<TEXTAREA name="t2" size="10" rows="1"></TEXTAREA><input type="button" value="済" onClick=setData1()><br> <textarea rows="9" cols="20" name="list"></textarea><br> </form> </body> </html>

  • DOMの要素ををtextarea(dropした位置

    jquery ui のdraggable,droppableを使って、あるDOMの要素ををtextarea(dropした位置)に挿入したいです。 ドラッグ、ドロップは普通に動かせるのですが、以下の機能が実装できません。 情報お持ちの方、いらっしゃいましたら、お願いします。 ドラッグ中、または、ドロップした瞬間に、textareaのキャレット位置を取得する 実装方法が思いつきません。 (ドロップ時点です。) 欲を言えば、ドラッグ中にキャレット位置を表示させたいです。 ※ちょうど、chromeやFFで画像をテキストエリアにドラッグするようなイメージです。

  • ボックスエリアに写真を貼り付けるには（２）

    ボックスエリアに写真を貼り付けるため、以下のようにテキストエリアの背景画像として挿入を試みたところ、テキスト・エリアに画像の一部のみ表示されました。 質問１： 画像全体を表示させるにはどうしたらよいでしょうか。 質問２： テキストエリアの右側が空白になっていますが、空白部にも見出し、小見出し、テキストを表示させるにはどうしたらよいでしょうか。 <div style="background-color:#0ff;width:950px;height:200px;overflow:auto;"> <TEXTAREA rows="10" cols="25"style="background-image:url(flower008.jpg);"> </TEXTAREA> <FONT STYLE="font-size:8mm" COLOR="#808000" SIZE="8">見出し</FONT> <h3>小見出し</h3> <FONT STYLE="font-size:5mm" SIZE="5">テキスト</FONT>

  • ファイルメーカーによるリストの作成法を教えて下さい

    　FileMaker Pro 7で作成したデータベースの一定条件を満たすレコードの特定のフィールドをリスト形式で表示させるにはどうしたらよいでしょうか。 　ニュース記事１本を、１レコードに収め、日付、見だし、リード、本文をそれぞれ別のフィールドに記録、電子、運輸機器、化学等の業種を分類するためのフィールドも設けました。 　例えば、電子関連の記事を検索、日付順にソートして、『日付／見だし／リード』のみのリストをモニター上に表示させるにはどうしたらよいでしょうか。 　試みに『日付／見だし／リード』のみのレーアウトを作成、上記の検索を実行、『リスト形式』を選択したところ、最初の記事１本のみの『日付／見だし／リード』が上部に表示されました。スクロール・バーで下方に画面をスクロールさせたところ、他の記事の『見だし』や『リード』がバラバラに現れましが、整然としたリストとしては表示されませんでした。

  • <textarea>にプルダウンを表示させたい

    いつも、当コーナーで大変お世話になっております。 今回も、壁にぶつかってしまいましたのでご質問させていただきます。 （今回も、CSSやPHP等は使用しません（・・・というより、使用できません）） いま下記のタグ構成（JavaScript）でページを作成しています。 --------------------------------------- <html> <head> <title>sample</title> </head> <body bgcolor="lightgreen"> <center> <span style="width:500;height:40;font-size:25pt;font-family:ふみゴシック;color:#ff6533;filter:shadow(color=#000000);">インバウンド or アウトバウンド</span> <br> <br> <table> <tr> <td> <script language="javascript"> <!-- function fun_set(set_name){ txtarea.value = eval(set_name).value; } //--> </script> <select name="状態" size="1" onChange="javascript:fun_set(状態);"> <option value="">選択してください <option value="（開始時間　8/?? 0:00） 【問い合わせ】 応答者情報 ・応答者 　氏名：　（続柄：） ・応答者 電話番号 　固定： 　携帯： 【結果】 ・8/ 0:00 現アポ完 （完了時間　0:00）">インバウンド <option value="（開始時間　8/?? 0:00） 【問い合わせ】 応答者情報 ・応答者 　氏名：　（続柄：） ・応答者 電話番号 　固定： 　携帯： 【結果】 ・8/ 0:00 現アポ完 （完了時間　0:00）">インバウンド（いわき） <option value="（開始時間　8/?? 0:00） 【発信詳細】 応答者情報 ・応答者 　氏名：　（続柄：） ・応答者 電話番号 　固定： 　携帯： 【結果】 ・資料郵送希望　確認完了 （完了時間　0:00）">アウトバウンド </select> </td> </tr> <tr> <td> <textarea name="txtarea" cols="100" rows="25"></textarea> </td> </tr> </table> </center> </body> </html> --------------------------------------- <textarea>内を上部プルダウンより内容を選択して活用するツールです。 ここで、プルダウンより選択した項目の内容が<textarea>に表示された後、更にその中でプルダウンメニューを作成したいです。 どのようにすれば作成できますでしょうか？ イメージは下記に掲載しております。 お手数かけて申し訳ありませんが、何卒、ご教授の程よろしくお願いいたします。

  • 小さいサイズの液晶パッド？

    こんにちわ。 最近、通勤中に電子書籍が読めるようにノートサイズのパッドが発売されていて、私の母も持っています。 私は、 ・パスケースサイズか、少し大きいくらいの大きさ ・txtやhtml、jpg等をUSB接続でコピペして閲覧できる。(複雑な接続や一般的な接続でないもの、使い勝手の悪い付属ソフトが必要なものはちょっと…ソフト簡単なものならいいんですけど…)ちなみに優先順位は、txtです。他はできなくてもいいです。 ・txtの場合、縦にスクロールできたりするとなおいい。 ・タッチパッドが苦手なので、タッチパッドオンリーでなく、ボタンorタッチやボタンオンリーとかだとなおいい。 テキストを見ることに特化した簡単操作の小さいパットが欲しいということです。 わがままな注文ですみません…サイズの大きいものや、自分の携帯に何かソフトを入れて…や、自分で映す絵を選択できるタイプのフォトスタンドで代用することや、iフォンとか色々考えましたが、しっくりこなくて… 何かいい商品がありましたら、情報をお願いします！

  • OKWaveの表示について

    環境は FireFox　+　Stylish　です やりたい事としては OKWaveの表示で　初めから全ての回答を全文表示にしたい というものです 同じような質問として　　http://okwave.jp/qa/q8903796.html .a_textarea.qa_no_display_area .a_textarea.qa_display_toggle_area, あたりの表示・非表示を設定して特定ページでは実現できたのですが 幾つかのページを移動させたところ 全文表示で必ず片方を表示にすればいい というわけにはいかなそうだということが分かりました FireDebugでHTMLの該当部分を確認すると添付画像のような情報となります 画像中の <div class="user_area"> の下の a_textarea　qa_display_toggle_area　　をチェックして a_textarea　qa_display_toggle_area　なら スタイルAを適用 そうでない(a_textarea　qa_display_area)ならスタイルBを適用 とできればうまくできそうなのですが そういったことができるのか できるとしたらどのような記述をすればいいのかが分かりません （判定の部分をどうすればいいのかが分からない） もし自分も同じことやっている・こうすればいいなど分かる方がいたら 情報をいただけないでしょうか

  • filemaker pro6での画像ファイルの扱いについて

    はじめまして、お世話になります。 この度win版filemaker pro6で顧客情報の管理をするデータベースを作成しているのですが、画像の取り扱いで行き詰ってしまいました。 実行されたい結果としては、 スクリプトで挿入されるテキストフィールドがあり、 挿入が実行されてフィールドにテキストが存在した場合、 別のオブジェクトフィールドに画像（参照データのみ）を挿入する といった処理なのですが、こういった処理はpro6で実現は可能なのでしょうか？ また、画像を計算結果で（ファイルパスの一部をフィールドで変数のようにしたい）、ということも実現はできるのでしょうか？ もし、方法がわかる方がいらっしゃれば、ご教授願えれば、と思います。 よろしくお願いします。

  • テキストエリアの選択行番号を返す関数

    下記のようなJavaScriptで、削除ボタンが押されたときにテキストエリアの何行目が 選択されているかを返す関数を作成途中なのですが、残りの部分がわかりません。 どうすれば、実現できるのか教えていただけないでしょうか。 <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>ホームバンキング</title> <script language="javascript"> <!-- document.form1.display.focus(); // テキストエリアにまずフォーカスを与える function select_row(){ // テキストエリアの何行目がクリックされているかを返す関数 var textarea = document.getElementById('display'); // テキストエリアのHTMLエンティティを取得 for(var i=0; i<textarea.length; i++){ if() break; // テキストエリアのi行目が選択されていたら、 } //document.form1.display.select(); // テキストエリアを選択状態にする return i; } //--> </script> </head>

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する
質問する