4

私はリッチテキストエディタに取り組んでおり、今までうまくいきました。.jsプラグインとして使用するために別のファイルを作成しました。

このプラグインをファイルでクラス名を付けて使用したいのですが、.cshtmlうまくいかないようです。関連する回答を検索したところ、使用document.getElementsByClassNameすると問題が解決するとのことでした。

このコードに目を通し、何が悪かったのか教えてください。

テキストエディタ.js-

var richTextEditor = document.getElementsByClassName("text-editor");
    richTextEditor.contentDocument.designMode = 'ON';
    $('#strong').live('click', function () {
        richTextEditor.contentDocument.designMode = 'ON';
        richTextEditor.contentDocument.body.contentEditable = true;

        richTextEditor.contentDocument.execCommand('bold', false, null);
        richTextEditor.focus();
    });

cshtmlファイル-

<script src="/js/Texteditor.js" type="text/javascript"></script>
<script src="/js/jquery.js" type="text/javascript"></script>
 <div  id="strong" class="command btn"><i class="icon-bold icon-black"></i></div>



    <iframe id="edtNoteCreate" class="text-editor"  name="DisplayNote" style="width:430px;height:150px;">@((Model.Note != null ? Model.Note : ""))</iframe>
4

5 に答える 5

8

一致したノードの最初の項目を取得するだけです。これはNodeListですが、配列のように逆参照できます。

var richTextEditor = document.getElementsByClassName("text-editor")[0];
于 2013-03-21T04:12:43.750 に答える
3

getElementsByClassNameは配列を返すため、次のように使用します

 var richTextEditor = document.getElementsByClassName("text-editor");
    richTextEditor[0].contentDocument.designMode = 'ON';
    $('#strong').live('click', function () {
        richTextEditor[0].contentDocument.designMode = 'ON';
        richTextEditor[0].contentDocument.body.contentEditable = true;

        richTextEditor[0].contentDocument.execCommand('bold', false, null);
        richTextEditor[0].focus();
    });
于 2013-03-21T04:05:21.093 に答える
1

なぜjqueryメソッドを使用しないのですか？

var richTextEditor = document.getElementsByClassName("text-editor");

instead try this:

var richTextEditor = $(".text-editor"); //again this is going to return more than  one object.

//so you can also try below code to manipulate in that.

var richTextEditor = $(".text-editor").first(); //for first element. similarly can use .last() or n-th child.
于 2013-03-21T04:13:10.130 に答える
0

jQueryを使用しているので、jQueryに固執してみませんか。

  var richTextEditor = $('.text-editor').eq(0);

またlive、jQueryのメソッドは非推奨になり.on()ました。代わりに使用してください。

于 2013-03-21T04:30:11.847 に答える
0

$（ "。text-editor"）はHTMlオブジェクトを返します。「document.getElementsByClassName（ "text-editor"）」は配列オブジェクトを返します。

于 2013-03-21T05:47:06.107 に答える