2010-08-07 140 views
0

我正在研究所见即所得的文本编辑器,并且正在研究在所见即所得模式和BBcode模式之间切换的功能。在进行切换后,我无法使其以所见即所得模式显示。Javascript tostring问题

function editormode() 
{ 
var html; 

var bbcode = new Array(); 
var htmlcode = new Array(); 
    htmlcode[0] = "<b>"; bbcode[0] = "[b]"; 
    htmlcode[1] = "</b>"; bbcode[1] = "[/b]"; 
    htmlcode[2] = "<i>"; bbcode[2] = "[i]"; 
    htmlcode[3] = "</i>"; bbcode[3] = "[/i]"; 
    htmlcode[4] = "<u>"; bbcode[4] = "[u]"; 
    htmlcode[5] = "</u>"; bbcode[5] = "[/u]"; 
    htmlcode[6] = "<strike>"; bbcode[6] = "[strike]"; 
    htmlcode[7] = "</strike>"; bbcode[7] = "[/strike]"; 
    htmlcode[8] = "<sub>"; bbcode[8] = "[sub]"; 
    htmlcode[9] = "</sub>"; bbcode[9] = "[/sub]"; 
    htmlcode[10] = "<sup>"; bbcode[10] = "[sup]"; 
    htmlcode[11] = "</sup>"; bbcode[11] = "[/sup]"; 

if (editormode == "true") { 

    htmltext = document.getElementById('editor').contentWindow.document.body.innerHTML; 

    for(i = 0; i < 12; i++){ 
    searchtext = htmltext.search(htmlcode[i]); 

    if(searchtext != -1) { 
    htmltext = htmltext.replace(htmlcode[i], bbcode[i]); 
    } 
    } 

    html = document.createTextNode(htmltext); 
    document.getElementById('editor').contentWindow.document.body.innerHTML = ""; 
    html = document.getElementById('editor').contentWindow.document.importNode(html,false); 
    document.getElementById('editor').contentWindow.document.body.appendChild(html); 

    editormode = "false"; 
} else { 

    htmltext = document.getElementById('editor').contentWindow.document.body.innerHTML; 

    for(i = 0; i < 12; i++){ 
    searchtext = htmltext.search(bbcode[i]); 

    if(searchtext != -1) { 
    htmltext = htmltext.replace(bbcode[i], htmlcode[i]); 
    } 
    } 

    html = document.createTextNode(htmltext); 
    document.getElementById('editor').contentWindow.document.body.innerHTML = ""; 
    html = document.getElementById('editor').contentWindow.document.importNode(html,false); 
    document.getElementById('editor').contentWindow.document.body.appendChild(html); 

    editormode = "true"; 
} 
} 
+0

我们可以看到代码在您设置editormode为false。忽略这个。我认为editormode = true;底部是在其他地方。格式化很难阅读。 – 2010-08-07 17:12:03

回答

0

如果我所看到的是正确的,它看起来像你这样做String.replace(),文字的整个身体,并且只使用一个字符串来找到一个目标来代替。

我怀疑发生了什么,是你只替换了你试图找到和替换的标签的第一个实例。在传递字符串时使用String.replace()作为搜索参数时,它只会查找并替换匹配子字符串的第一个实例。

"hello".replace('l', 'r'); // returns "herlo" and not "herro" 

尝试预先形成接替之前更改搜索字符串到全球正则表达式:

var tagEx = new RegExp(htmlcode[i], 'g'); 
htmltext.replace(tagEx, bbcode[i]); 

我相信,这将解决您的问题。此外,当你这样做时,你可能不需要事先打电话String.search()。对没有匹配的字符串调用String.replace()没什么不好。所以,摆脱这个检查,甚至可以为你节省一些计算时间。

另一件值得一提的事情,我不确定这是否与您的其他代码冲突,是因为当您执行数组循环时,您并未使用var来实例化您的增量变量。在var i=0中,有时会导致问题,因为不使用var会创建一个全局变量,这可能与其他地方的代码发生冲突。

希望有所帮助。

0

你的函数有几个问题,但是,字符串替换问题可能是使它看起来不能转换任何东西的错误。 下面是一个小版本的功能,这对我的作品:

function editormode(is_editor_mode) { 
    var replaceTagsByMode = function(html, is_editor_mode) { 
     var tags = {}; 
     for (var i=0, a=['b', 'i', 'u', 'strike', 'sub', 'sup']; i<a.length; i++) { 
      tags[['<', a[i], '>'].join('')] = ['[', a[i], ']'].join(''); 
      tags[['</', a[i], '>'].join('')] = ['[/', a[i], ']'].join(''); 
     } 

     for (var html_tag in tags) { 
      if (tags.hasOwnProperty(html_tag)) { 
       html = html.replace.apply(
         html, is_editor_mode ? [html_tag, tags[html_tag], 'g'] : [tags[html_tag], html_tag, 'g']); 
      } 
     } 
     return html; 
    }; 
    var editor_body = document.getElementById('editor').contentWindow.document.body; 
    editor_body.innerHTML = replaceTagsByMode(editor_body.innerHTML, is_editor_mode); 
} 
0

这可能是最好的利用现有的代码,这样做,如bbc2html(只是将设置高亮到HTML)或bbeditor(整个编辑器)。另见Simple WYSIWYG BBCode editor for JavaScript?

如果你宁愿把它写自己,因为将这些标签可以是简单:

html = bbcode.replace(/\[(\/?(b|i|u|strike|sub|sup))\]/gi, '<$1>'); 

bbcode = html.replace(/<(\/?(b|i|u|strike|sub|sup))>/gi, '[$1]');