0

快速提问,我想将一些降价 HTML 内容从双星号转换为粗体。

我得到的错误是:`Uncaught TypeError: Cannot call method 'replace' of null '

这是jsfiddle:http: //jsfiddle.net/fz5ZT/9/

这是HTML:

<div class="comments">comment 1** is good**</div>
<div class="comments">comment 2**is bad**</div>

这是JS:

function markdown(markdownable){

  var boldMatch = markdownable.match(/\*\*[A-Za-z0-9]+\*\*/gim), 
  boldReplace = boldMatch.replace(/\*\*[A-z0-9]+\*\*/gim, '<span style="font-  weight:bold;color:blue;">'+boldMatch+'</span>'),                   
  markdownable = markdownable.replace(boldMatch, boldReplace),    
  markdownable = markdownable.replace(/\*\*/gi, "");

  return markdownable;
}

$('.comments').each(function(){  
   var markdownable=$(this).html(), comments=markdown(markdownable);
});

如果您能提供帮助,我将不胜感激,

谢谢,蒂姆

更新谢谢大家!请看这个工作演示:http: //jsfiddle.net/fz5ZT/30/

4

5 回答 5

6
markdownable = markdownable.replace( /\*\*(.+?)\*\*/gm, '<strong>$1</strong>' );

然而,与其进行一次三心二意、善意的、注定要失败的重新发明轮子的尝试,为什么不直接使用现有的 JavaScript Markdown 库呢?

编辑:这是一个更强大的正则表达式(如 Markdown)要求在“打开”之后或“关闭”之前没有空格:

var bold = /\*\*(\S(.*?\S)?)\*\*/gm;
markdownable = markdownable.replace( bold, '<strong>$1</strong>' );
于 2012-04-19T17:19:50.577 回答
2

您的第一个正则表达式匹配忽略字符串中的空格。您需要在允许的字符集中添加一个空格,[ a-z0-9];你不需要 theA-Z因为i.

此外,match返回一个数组,因此您需要获取第一个匹配项,boldMatch[0]以便访问返回的字符串。

于 2012-04-19T17:16:44.900 回答
1

您不想在 boldMatch 上调用 .replace() ,直到您知道其中有一个值可以使用,也就是说,如果没有匹配项。

更安全的计算:

var boldMatch = markdownable.match(/\*\*[A-Za-z0-9]+\*\*/gim);
if (boldMatch) { 
  var boldReplace = boldMatch.replace(/\*\*[A-z0-9]+\*\*/gim, '<span style="font- weight:bold;color:blue;">'+boldMatch+'</span>');
}

等等

更新:

这行代码也使追踪发生的事情变得困难:

var markdownable=$(this).html(), comments=markdown(markdownable);

通常不赞成用 var 在一行上声明两个变量。更好的:

var markdownable=$(this).html();
if (markdownable) {
    comments=markdown(markdownable);
}
于 2012-04-19T17:19:01.743 回答
1

也许你可以看看以下解决方案:

使用jQuery查找文本字符串?

我相信你需要做一些非常相似的事情:

  $('*:contains("I am a simple string")').each(function(){
 if($(this).children().length < 1) 
      $(this).html( 
           $(this).text().replace(
                /"I am a simple string"/
                ,'<span containsStringImLookingFor="true">"I am a simple string"   </span>' 
           )  
       ) 
});

为了使元素变为粗体,您需要在替换发生后使用 addClass() 。

谢谢

于 2012-04-19T17:22:01.810 回答
1
function markdown(markdownable) {

    var boldMatch = markdownable.match(/[\*]{2}( .+)?[\*]{2}/gim);
    if (boldMatch && (boldMatch = boldMatch[0])) {
        var boldReplace = boldMatch.replace(/[\*]{2}( .+)+?[\*]{2}/gim, '<span style="font-weight:bold;color:blue;">' + boldMatch + '</span>');
        markdownable = markdownable.replace(boldMatch, boldReplace);
        markdownable = markdownable.replace(/\*\*/gi, "");
    }
    return markdownable;
}

$('.comments').each(function() {

    var markdownable = $(this).html(),
        comments = markdown(markdownable);

    console.log(comments);
});​

到目前为止,这不是最好的解决方案……但它是您尝试的“修复”。希望你能学到一些关于你出错的地方。

于 2012-04-19T17:24:41.347 回答