2013-07-12 37 views
0

我使用jquery spellcheck和實施類似下面的頁面上的文本框...jQuery的拼寫檢查器如何訪問

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

感謝

+0

請問您可以告訴您尋找哪個文本框的值?爲什麼? –

+0

該文本框是一個類.cul,並從該框中獲取語言值 – Beginner

+0

我想動態設置語言,這是不同的每頁 – Beginner

回答

0

的CKEDITOR插件可以訪問使用editor.name屬性的當前實例ID。 然後使用$('#'+ editor.name)將爲您提供當前CKEDITOR的目標textarea。

你寫的CKEDIOR插件,所以而不是有獨立的方式來設置文化,它應該是目標textarea的一部分。在那裏,您可以設置基於HTML 5的數據屬性,如data-culture,這將爲您提供RichTextbox所需的文化。

可能會有一些業務場景,其中一個頁面將具有多個RichTextBox控件,每個RichTextBox控件都具有不同文化,如聯機Google翻譯器頁面。

+0

默認情況下,您可以設置lang:'en'或什麼都可以。然後在'init'中,您可以獲得正確的文化價值並將其設置在那裏。 –

+0

您也可以投票anwser :) –