リッチテキストボックスの使用
5208 ワード
関連資料のダウンロードアドレス
まず関連するjs,cssを導入する
まず関連するjs,cssを導入する
jQueryとbootstrapに するjs、cssは で する.テキストボックスのhtmlコードをwysiwygにカプセル しましたjsp:
は、その 、 する jsをカプセル する、jsに してwysiwygに することができる.jsp(ここでは の の1つの しか っていません):function showWysiwyg() {
function initToolbarBootstrapBindings() {
var fonts = [ 'Serif', 'Sans', 'Arial', 'Arial Black', 'Courier',
'Courier New', 'Comic Sans MS', 'Helvetica', 'Impact',
'Lucida Grande', 'Lucida Sans', 'Tahoma', 'Times',
'Times New Roman', 'Verdana' ], fontTarget = $('[title=Font]')
.siblings('.dropdown-menu');
$.each(fonts, function(idx, fontName) {
fontTarget.append($('' + fontName
+ ' '));
});
$('a[title]').tooltip({
container : 'body'
});
$('.dropdown-menu input').click(function() {
return false;
}).change(
function() {
$(this).parent('.dropdown-menu').siblings(
'.dropdown-toggle').dropdown('toggle');
}).keydown('esc', function() {
this.value = '';
$(this).change();
});
$('[data-role=magic-overlay]').each(
function() {
var overlay = $(this), target = $(overlay.data('target'));
overlay.css('opacity', 0).css('position', 'absolute')
.offset(target.offset()).width(target.outerWidth())
.height(target.outerHeight());
});
$('#voiceBtn').hide();
}
;
initToolbarBootstrapBindings();
$('#editor').wysiwyg();
window.prettyPrint && prettyPrint();
}
, jsp jsp include