同じページに複数のコードが必要なため、WMD エディターの元のコード (スタック オーバーフロー バージョンではありません) を使用しています。スタック オーバーフローのバージョンは、複数のエディター インスタンスを持たないため、要素 ID を内部的に多用します。 1ページあたり。
コードは Firefox 3.5 などでは問題なく動作します。ただし、Internet Explorer 8 (Internet Explorer 7 互換モード) で実行すると、ブラウザー全体が約 3 秒間フリーズします。新しいインスタンスが表示される前に。Internet Explorer の開発ツールでプロファイリングしてみたところgetWidth()
、縮小版のコードの 520 行目の関数が常に占有されているようです。しかし、戻り値をハードコーディングしようとすると (常に同じものを返すため)、ボトルネックはgetHeight()
関数に移行しました。
jQueryプラグインに変換するために使用しているコードを添付しています。
jQuery.fn.wmd = function(params) {
function createInstance(container, params) {
/* Make sure WMD has finished loading */
if (!Attacklab || !Attacklab.wmd) {
alert("WMD hasn't finished loading!");
return;
}
var defaultParams = {
width : "600px",
rows : 6,
autogrow : false,
preview : false,
previewDivClassName: "wmd-preview-div"
};
if (typeof(params) == "undefined") {
var params = defaultParams;
}
else {
var params = jQuery.extend({}, defaultParams, params);
}
/* Build the DOM elements */
var textarea = document.createElement("textarea");
textarea.style.width = params.width;
textarea.rows = params.rows;
jQuery(container).append(textarea);
var previewDiv = document.createElement("div");
if (params.preview) {
jQuery(previewDiv).addClass(params.previewDivClassName);
jQuery(container).append(previewDiv);
}
/* Build the preview manager */
var panes = {input:textarea, preview:previewDiv, output:null};
var previewManager = new Attacklab.wmd.previewManager(panes);
/* Build the editor and tell it to refresh the preview after commands */
var editor = new Attacklab.wmd.editor(textarea,previewManager.refresh);
/* Save everything so we can destroy it all later */
var wmdInstance = {ta:textarea, div:previewDiv, ed:editor, pm:previewManager};
var wmdInstanceId = $(container).attr('postID');
wmdInstanceProcs.add(wmdInstanceId, wmdInstance);
if (params.autogrow) {
// $(textarea).autogrow();
}
};
if (jQuery(this).html().length > 0) {
var wmdInstanceId = jQuery(this).attr('postID');
var inst = wmdInstanceProcs.get(wmdInstanceId);
jQuery(inst.ta).show();
}
else {
createInstance(this, params);
}
}
jQuery.fn.unwmd = function(params) {
var wmdInstanceId = $(this).attr('postID');
var inst = wmdInstanceProcs.get(wmdInstanceId);
if (inst != null) {
jQuery(inst.ta).hide();
}
}
wmdInstanceProcs = function() {
var wmdInstances = { };
var getProc = function(wmdInstanceId) {
var inst = wmdInstances[wmdInstanceId];
if (typeof(inst) != "undefined") {
return inst;
}
else {
return null;
}
};
var addProc = function(wmdInstanceId, wmdInstance) {
wmdInstances[wmdInstanceId] = wmdInstance;
};
return {
add: addProc,
get: getProc
};
}();
どんな助けでも大歓迎です。