如何使用JQuery检测•符号并将它们转换为HTML ul

How to detect • symbols and transform them into HTML ul's using JQuery

本文关键字:转换 ul HTML JQuery 何使用 检测 符号      更新时间:2023-09-26

我有一些副本,我想用JQuery转换成HTML。

以下是我在文本区域中处理的文本示例:

    Monday 28th October 2013
    18:30 Some text 
    17:30 Another bit of text 
    Day two Tuesday 29th October 2013
    11:00 Some title goes here
    • Point 1
    • Point 2
    • Point 3
    Some text to go here
    18:30 Some text 

我正在尝试将使用 • 符号制作的列表转换为包装在 ul 标签中的正确 html 列表,同时删除符号。我还想让任何时间加粗。

这将是预期的结果:

<b>11:00</b> Some title goes here
<ul>
<li>Point 1</li>
<li>Point 2</li>
<li>Point 3</li>
</ul>

我对正则表达式知之甚少,并且找不到有关此特定问题的任何资源,因此任何指针都将不胜感激!

我尝试使用以下代码使时间加粗,但由于某种原因我无法让它工作:

var oldHtml = $('textarea').html();
var newHtml = oldHtml.replace(^'d{2}:'d{2}$)/g,"<b>$1</b>");
$('textarea').html(newHtml);​

提前谢谢。

假设你有以下 HTML 文本区域和div 来显示 html

<div id="display">Entered html will show here</div>
<textarea id="markup"></textarea>

首先你需要分割线条

var lines = $('#markup').val().split(/'n/);
var html = '';

然后遍历您的行并检查哪个以 • 开头 •

for(var i = 0; i < lines.length; i++){
   if(lines[i].match(/^(•|'t)/)) {
      html += '<li>'+lines[i].replace('•', '').replace(''t','')+'</li>';
   } else {
      html += lines[i];
   }
}

现在您可以执行以下操作以在某些div 中显示新的格式化 html

$('#display').html(html);