問題タブ [redactor]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
python - Imperavi Redactor の feincms/admin/ への統合
FeinCMS には、1 つのフィールドで構成されるリッチ テキスト コンテンツがバンドルされています。デフォルトのエディターは TinyMCE インスタンスです。CKEditor のサポートが含まれており、他のリッチ テキスト エディターを簡単に統合できます。
redactor ( http://imperavi.com/redactor/ ) を feincms/admin/に統合しようとしています - マニュアルやハウツーはありますか?
試してみましたgithub.com/douglasmiranda/django-wysiwyg-redactor
-- 動作しません。
TypeError: $(...).redactor は関数ではありません
FireBug コンソールで。
テスト用のリダクターファイルは次の場所にありますgithub.com/douglasmiranda/django-wysiwyg-redactor/tree/master/redactor/static/redactor
使用したパッケージ: Django==1.6.1 + FeinCMS==1.9.1
どんな助けにも感謝します。
django - 実行時にテンプレートに挿入された Javascript URI は、適切な S3 バックエンド URL をレンダリングしません - 他のすべての挿入された管理 URL はそれに応じてレンダリングされます
管理アプリケーション内のブログ エントリ インターフェースに、パッケージ「django-wysiwyg-redactor」を使用しています。管理サイトが読み込まれると、パッケージは、リッチ テキスト エディターをレンダリングするために必要な JavaScript ファイルのいくつかのソース URL を挿入します。
私が取り組んでいるプロジェクトでは、S3 バケットからファイルを提供するために Boto バックエンドを使用しています。管理ページをレンダリングするために Django によって挿入された URL は正しくレンダリングされ、バケットへの呼び出しを行うための適切な S3 データが追加されます。
何らかの理由で、Redactor URL が正しくレンダリングされません。S3 バケットへの呼び出しを行うために必要なデータが追加されます。ローカル開発中 (リモート ファイル バックエンドを使用している間) はすべて正常に動作していました。
また、最初の展開時にすべてが正常に機能していました。
ちょうど今晩、私は開発ブランチ サイトをいじりに行きました - プロダクションと同じコード ベースを持っていました (これは初期展開中に機能していました) - ブログ エントリ フォームがレンダリングされていないことがわかりました。ブラウザ内の JavaScript コンソールを確認したところ、Redactor が使用するファイルに関連するいくつかのリソース ロード エラー メッセージが見つかりました。
ご覧のとおり、これらの URL は上記のリストと同じ形式ではありません。
必要なすべてのファイルは、実際に S3 バケット内に存在します。
何が起こっているのか理解できないようです。
どんな助けでも大歓迎です。
ありがとう!
symfony - symfony でリダクターを使用してフォームを送信できません
form-builder を使用して、Symfony2 でテキストエリアを持つフォームを作成しました。テキスト編集のために自分のフォームで redactor を使用したい。リダクター ライブラリを使用しない限り、すべて正常に動作します。しかし、クラス redactor をテキストエリアに適用すると、投稿リクエストで送信されません。required=false も設定しようとしましたが、それもうまくいきませんでした。
フォーム作成者:
HTML:
HTML の redactor のレンダリングされたコード:
誰でも助けることができますか?
jquery - Redactor js エディターと Bootstrap 3
Redactor HTML5 エディター コンポーネント (V9) を購入し、一日中使用しています。私はCKeditorを何年も使用しています。ただし、HTML5 では使用できません。要素を取り除き、コードを書き直し続けます。
エディターは HTML5 と Bootstrap 3 マークアップに対応できる必要があります。
Redactor は表面上は見栄えがします。しかし、それで時間を過ごした後、それはまだそれほど強力ではありません. はい、画像をアップロードできることはわかっています。しかし、DIV と CSS を適用するのはかなり生の経験のようです。
DIV とクラスを追加するためのカスタム ボタンを作成するのに数時間を費やしました。しかし、なぜ私はそんなに多くの仕事をする必要があるのですか?私は編集者を書きたくありません。
素晴らしいドキュメントがありますが、それでもかなり薄いです。より多くの例が本当に役に立ちます。
たとえば、CSS をライブ エディターに適用したい (CKeditor のように)。ただし、iframe に頼るのではなく、textares を置き換えるようにしたい。
また、エディターで非表示の div を表示できるようにしたいと考えています。そうしないと、ユーザーが迷子になり、レイアウトが破壊されます。
状況に役立つオンライン リソースを見つけた人はいますか? それとも、レイアウトを手作業でコーディングする必要があることをクライアントに伝える必要がありますか?
javascript - クリックイベントでキャレット位置を取得
ユーザーが段落内でクリックしたキャレット位置を取得するという、単純であるべきことを行うのに苦労しています。DOM を変更するユーザー入力に基づいて、WYSIWYG テキスト エディターRedactorのインスタンスをコンテキストに応じて作成および破棄しているため、これは複雑です。
私の構造:
ユーザーがテキストをクリックすると、次のように DOM を変更する redactor のインスタンスが初期化されます。
リダクターが初期化された後、ユーザーが最初にクリックした場所にカーソルを配置したいと思います。かなり簡単ですよね?さて、私のクリック ハンドラー (div.node にアタッチされています) ではwindow.getSelection()
、クリック前のキャレットの位置を返します。
たとえば、私は次のように言います。
<p>
char 5 を クリックします。- 「rangeCount: 0、type: None、anchorOffset: 0」を出力します
- Redactor を初期化し、コンテンツ
DIV
をラップして作成しますcontenteditable='true'
<p>
at char 位置 108 内をクリックします。- 「rangeCount: 1、type: Caret、anchorOffset: 108」を出力 (予想)
<p>
char 5 で 別のノードをクリックします。- 「rangeCount: 1、type: Caret、anchorOffset: 108」を出力 (予期しない)
- リダクターを破棄し、2 番目のノードの周りを再作成します
ステップ 1 と 3 では、「選択」は明らかに に渡されていません<p>
。これは、これらの時点で、<p>
問題のcontenteditable='true'
祖先には何もないため、実際には「選択」自体を持つことができないためだと思います。
私の質問:
<p>
ユーザーがクリックしたときに、非コンテンツ編集可能タグ内のマウスカーソルの下のキャレット位置を取得するにはどうすればよいですか?
どんな助け/アドバイスも大歓迎です!
(残念ながら、Redactor は自由に利用できないため、jsFiddle の例に含めることはできません)
アップデート
これらの「ノード」div は、jQueryUI のドラッグおよびドロップ可能なウィジェットも使用しています。これらを無効にすると、ハンドラーは選択の期待値を出力します...興味深いです。残念ながら、ドラッグ アンド ドロップ機能は必須です。