本文讲述在SharePoint 2013/2010中 使用JavaScript 将Div转换(render)成 Rich Text Box。
在SharePoint 开发的过程中,如果不能使用C#代码只用前台JavaScript,很难给页面添加Rich Text Box (可以和SharePoint的Ribbon menu 一起结合使用),而这种需求是比较多的,因为SharePoint开发越来越多的使用JavaScript,特别是SharePoint 2013,而且Office 365和SharePoint online 只能用JavaScript来进行二次开发。
SharePoint 2013 方案:
(function ($) {
$.fn.SPEditable = function () {
return this.each(function () {
$(this).addClass("ms-rte-layoutszone-inner-editable ms-rtestate-write").attr("role", "textbox").attr("aria-haspopup", "true").attr("contentEditable", "true").attr("aria-autocomplete", "both").attr("aria-autocomplete", "both").attr("aria-multiline", "true");
});
};
$.fn.SPNonEditable = function () {
return this.each(function () {
$(this).removeClass("ms-rte-layoutszone-inner-editable ms-rtestate-write").removeAttr("role aria-haspopup contentEditable aria-autocomplete aria-multiline");
});
};
})(jQuery);
$(document).ready(function () {
$("#myDiv").SPEditable();
});
效果:
SharePoint 2010 方案:
(function ($) {
$.fn.SPEditable = function () {
return this.each(function () {
$(this).addClass("ms-rtestate-write ms-rteflags-0 ms-rtestate-field").attr("role", "textbox").attr("aria-haspopup", "true").attr("style", "min-height: 84px;").attr("contentEditable", "true").attr("UseInlineStyle", "True").attr("aria-autocomplete", "both").attr("aria-multiline", "true");
});
};
$.fn.SPNonEditable = function () {
return this.each(function () {
$(this).removeClass("ms-rtestate-write ms-rteflags-0 ms-rtestate-field").removeAttr("role aria-haspopup style contentEditable UseInlineStyle aria-multiline");
});
};
})(jQuery);
$(document).ready(function () {
$("#myDiv").SPEditable();
});
效果:
注意2010/2013都需要预先引入Jquery.