jquery拼写检查器如何访问页面上的文本框

时间:2013-07-12 11:21:47

标签: jquery spell-checking

我正在使用jquery spellcheck并执行如下...

CKEDITOR.plugins.add('jqueryspellchecker', {    
    config: {
        lang: $('.cul').val,
    parser: 'html',
    disableNativeSpellChecker : false,
    webservice: {
      path: '/JQuerySpellCheckerHandler.ashx',
      driver: 'google'
    },
    suggestBox: {
      position: 'below',
      appendTo: 'body'
    },
    incorrectWords: {
        container: '#incorrect-word-list'
    }
  },

  init: function( editor ) {

    var t = this;
    var pluginName = 'jqueryspellchecker';

    this.config.suggestBox.position = this.positionSuggestBox();

    editor.addCommand(pluginName, {
      canUndo: false,
      readOnly: 1,
      exec: function() {
        t.toggle(editor);
      }
    });

    editor.ui.addButton('jQuerySpellChecker', {
      label: 'SpellCheck',
      command: pluginName
    });

    editor.on('saveSnapshot', function() {
      t.destroy();
    });
  },

  create: function() {
    this.createSpellchecker();
    this.editor.setReadOnly(true);
    this.spellchecker.check();
    this.editor.commands.jqueryspellchecker.toggleState();
  },

  destroy: function() {
    if (!this.spellchecker) 
      return;
    this.spellchecker.destroy();
    this.spellchecker = null;
    this.editor.setReadOnly(false);
    this.editor.commands.jqueryspellchecker.toggleState();
  },

  toggle: function(editor) {
    this.editor = editor;
    if (!this.spellchecker) {
      this.create();
    } else {
      this.destroy();
    }
  },

  createSpellchecker: function() {
      var t = this;

    t.config.getText = function () {
      //alert(t.editor.getData());
      //alert($(t.editor.container).attr("data-code"));      
      return $('<div >').append(t.editor.getData()).text();
    };

   // t.spellchecker = new $.SpellChecker($(t.editor.container), this.config);
    t.spellchecker = new $.SpellChecker('.cke_focus', this.config);
    t.spellchecker.on('check.success', function () {
      alert('There are no incorrectly spelt words.');
      t.destroy();
    });

    t.spellchecker.on('replace.word', function () {
      if (t.spellchecker.parser.incorrectWords.length === 0) {
        t.destroy();
      }
    });
  },

  positionSuggestBox: function() {

      var t = this;

    return function() {

      var ed = t.editor;
      var word = (this.wordElement.data('firstElement') || this.wordElement)[0];

      var p1 = $(ed.container.$).find('.cke_focus').offset();
      var p2 = $(ed.container.$).offset();
      var p3 = $(word).offset();

      var left = p3.left;
      var top = p3.top + word.offsetHeight;      

      this.container.css({ 
        top: top, 
        left: left  
      });
    };
  }
});

但是如何在页面上获取文本框的值来设置语言.. lang: $('.cul').val

由于

1 个答案:

答案 0 :(得分:0)

CKEDITOR插件可以使用 editor.name 属性访问当前实例ID。 然后使用$('#'+ editor.name)将为您提供当前CKEDITOR的目标文本区域。

你写CKEDIOR插件,所以不应该单独设置文化,而应该是目标textarea的一部分。在那里,您可以设置基于HTML 5的数据属性,例如数据文化,它将为您提供目标RichTextbox所需的文化。

可能存在一些业务场景,其中一个页面将具有多个RichTextBox控件,每个控件都具有不同的文化,例如在线Google翻译页面。