PDA

View Full Version : مشکل با سلکشن و bold &italic



redhat2
شنبه 09 فروردین 1393, 19:53 عصر
سلام ، من ادیتور زیر را نوشتم ، کل فایلو هم up کردم ، مشکلی که دارم اینه که زمانی که برای اولین روی ادیتور focus میکنم ، و بعد روی bold وبلافاصله روی italic کلیک میکنم و بعد شروع به نوشتن می کنم ، فقط Text را italic میکنه در حالی که اگه از همون اول focus کنم و بعد شروع کنم به نوشتن ، در ادامش اگه بیام روی bold و italic کلیک کنم و شروع به نوشتن کنم ، text هم bold و هم italic میشه ، چرا توی همون حالت اول هم bold و هم italic شدن را نداریم ؟ کسی میتونه اینا fix کنه ؟


(function ( $ ) {
$.fn.editor = function(options){
var settings = $.extend({
width: '650px',
height: '220px',
dir: 'rtl',
default_font: 'Tahoma,11px',
activeButtons: {
b: 'bold',
i: 'italic'
}
},options);
var div = '<div></div>';
var editor = $(div).addClass('editor').css({
'width':settings.width
});
var editor_toolbar = $(div).addClass('editor_toolbar');
var font = settings.default_font.split(',');
var editor_body = $(div).addClass('editor_body').attr(
'contenteditable','true').css({
'height':settings.height,
'direction':settings.dir,
'font-family': font[0],
'font-size': font[1]
});
var toolbar_1_buttons = ['bold','italic','textcolor','bgcolor'];
var toolbar_1_span = $('<span></span>').addClass('toolbar_1');
toolbar_1_span.appendTo(editor_toolbar);
for(var i=0;toolbar_1_buttons.length>i;i++){
var a = $('<a></a>').attr('href','javascript:void(null);');
var id = 'toolbar_button';
var a_span = $('<span></span>').addClass(toolbar_1_buttons[i]).attr({
'id':id,
'exec':toolbar_1_buttons[i]
});
a.attr({
'id':i+1
}).prepend(a_span).appendTo(toolbar_1_span);
}
editor_toolbar.prependTo(editor);
editor_body.appendTo(editor);
this.css('display','none');
$('body').append(editor);
$('.toolbar_1 span').each(function(){
if($(this).hasClass('textcolor') || $(this).hasClass('bgcolor'))
{
$(this).parent('a').append($('<span></span>').addClass('arrow'));
}
})
editor_body.prepend($('<p></p>'));
$('span[id=toolbar_button]').click(function(){
editor_body.focus();
document.execCommand($(this).attr('exec'),false,nu ll);
});
editor_body.focus(function(){
var text = editor_body.text();
if(text == '')
{
rangy(getSelection(),document.getElementsByTagName ('div')[2].childNodes[0]);

}
else
{
rangy(getSelection(),getCurrentNode());
}
});


editor_body.on('click keyup',function(e){
if(e.keyCode == 8 || e.keyCode == 46)
{
var html = $.trim($(this).html());
if(browser('mozilla'))
{
html = html.replace(/<br>/i, '');
}
if(html == '')
{
e.preventDefault();
editor_body.prepend($('<p></p>'));
rangy(getSelection(),this.childNodes[0]);
}
}
inactiveAllButtons();
observeFormatting();
});



function browser(browser)
{
var ua = navigator.userAgent.toLowerCase();
var match = /(chrome)[ \/]([\w.]+)/.exec(ua) || /(webkit)[ \/]([\w.]+)/.exec(ua) || /(opera)(?:.*version|)[ \/]([\w.]+)/.exec(ua) || /(msie) ([\w.]+)/.exec(ua) || ua.indexOf("compatible") < 0 && /(mozilla)(?:.*? rv:([\w.]+)|)/.exec(ua) || [];

if (browser == 'version')
{
return match[2];
}

if (browser == 'webkit')
{
return (match[1] == 'chrome' || match[1] == 'webkit');
}
return match[1] == browser;
}
function rangy(selection,elem)
{
var range = document.createRange();
range.setStart(elem,selection.anchorOffset);
range.setEnd(elem,selection.focusOffset);

try{
selection.removeAllRanges();
}
catch(e){}
selection.addRange(range);
}
function getSelection(){
var doc = document;

if (window.getSelection)
{
return window.getSelection();
}
else if (doc.getSelection)
{
return doc.getSelection();
}
else{
return false;
}
}
function getSelectedNode(){
if (typeof window.getSelection !== 'undefined')
{
var s = getSelection();
if (s.rangeCount > 0)
{

return s.getRangeAt(0).commonAncestorContainer;

}
else
{
return false;
}
}
else if (typeof document.selection !== 'undefined')
{
return getSelection();
}
}

function getCurrentNode(){
if (typeof window.getSelection !== 'undefined')
{
return getSelectedNode().parentNode;
}
else if (typeof document.selection !== 'undefined')
{
return getSelection().parentElement();
}
}


function inactiveAllButtons(){
$.each(toolbar_1_buttons,function(i,s){
$('span[exec='+s+']').removeClass(s + '_active');
})
}
function observeFormatting(){
$.each(settings.activeButtons,function(i,s){
var parent = getCurrentNode();
if($(parent).closest(i,$(editor_body).get()[0]).length != 0){
setBtnActive(s);
}
});
}
function setBtnActive(s){
$('span[exec='+s+']').addClass(s + '_active');
}

}
}( jQuery ));


کله فایلم up کردم .