0

Ext.form.field.HtmlEditor（xtype：'htmleditor'）にテキストを入力しているときにユーザーがctrl + enterを押したときにajaxリクエストを作成しようとしていますが、その方法がわかりません。
「htmleditor」の値を送信できる「htmleditor」の横にボタンがありますが、ctrl+enterを使用してその操作のキーボードショートカットを追加したいと思います。
いくつかの助けに感謝します。

編集：ExtJS4で作成する必要があります-どういうわけか、「keypress」リスナーのようなものをhtmleditorオブジェクトに追加する必要があります...
これがコードです。 

this.htmleditor = this.addComment.add({
    region:'center',
    xtype:'htmleditor',
    margin:'0 0 0 0',
    enableSourceEdit:false,
    height:200
});
4

3 に答える 3

4

デフォルトのhtmleditorではイベントをリッスンできません。したがって、更新されたバージョンを使用する必要があります。

このコードは役に立ちます（extjs 3用なので、4バージョンに変更する必要があるかもしれません）：

Cyber.ui.HtmlEditor = Ext.extend(Ext.form.HtmlEditor, {
        frame : true,
        initComponent : function() {
            Cyber.ui.HtmlEditor.superclass.initComponent.call(this);
            this.addEvents('submit');
        },
        initEditor : function() {
           Cyber.ui.HtmlEditor.superclass.initEditor.call(this);
            if (Ext.isGecko) {
                Ext.EventManager.on(this.doc, 'keypress', this.fireSubmit,
                        this);
            }
            if (Ext.isIE || Ext.isWebKit || Ext.isOpera) {
                Ext.EventManager.on(this.doc, 'keydown', this.fireSubmit,
                        this);
            }
        },
        fireSubmit : function(e) {
            if (e.ctrlKey && Ext.EventObject.ENTER == e.getKey()) {
                // Do what you need here
            }
        }
});

Ext.reg('customeditor', Cyber.ui.HtmlEditor);

そしてあなたの形で：

this.htmleditor = this.addComment.add({
    region:'center',
    xtype:'customeditor',
    margin:'0 0 0 0',
    enableSourceEdit:false,
    height:200
});

私はExtjs4でたくさん遊んで、その方法を見つけました（htmleditorを使用する前にこのコードを含める必要があります）：

Ext.form.HtmlEditor.override({
    frame : true,
    initComponent: function() {
        this.callOverridden();
        this.addEvents('submit');
    },

    initEditor : function() {
        this.callOverridden();

        var me = this;
        var doc = me.getDoc();

        if (Ext.isGecko) {
            Ext.EventManager.on(doc, 'keypress', me.fireSubmit, me);
        }

        if (Ext.isIE || Ext.isWebKit || Ext.isOpera) {
            Ext.EventManager.on(doc, 'keydown', me.fireSubmit, me);
        }
    },

    fireSubmit : function(e) {
        if (e.ctrlKey && Ext.EventObject.ENTER == e.getKey()) {
            // Do what you need here
            alert('yes!');
        }
    }
});
于 2011-07-12T12:14:30.663 に答える
0

これはあなたが求めているものですか（すでにスタックにありました：P）？Ctrl + Enter jQuery in TEXTAREA：

$('#textareaId').keydown(function (e) {
e = e || event; // for compatibility with IE (i belive)
  if (e.ctrlKey && e.keyCode == 13) {
    // Ctrl-Enter pressed
  }
});
于 2011-07-12T12:02:19.993 に答える
0

ExtJs 6で動作しました（例ではEnterキーが無効になっています）：

Ext.create('Ext.form.HtmlEditor', {
    width: 580,
    height: 250,
    renderTo: Ext.getBody(),
    listeners:{
       initialize: function(editor){
           const doc = editor.getDoc();
           const docEl = Ext.get(doc);
           docEl.on({
              keypress: (e)=>{
                if (e.event.code === 'Enter'){
                  e.preventDefault();
                }
              },
              delegated:false,
              scope: editor
           });
       }
    }
});
于 2020-12-15T16:24:19.120 に答える