Question

我所拥有的代码的功能是检测带方括号外壳的任何条目。然后它将使用jquery在html中显示。我正在尝试为我的博客网站创建一个短代码来显示图像，视频等...，虽然我不确定这是否是正确的方法。代码完全按照我的需要工作，但每次我想创建另一个机箱并且＆＃34;返回＆＃34;，我必须单独完成。 Fiddle here

  [[Link1]] [[Link2]]
  [img]http://www.w3schools.com/images/lamp.jpg[/img]

$(".test").html(function(i, html) {
  return html.replace(/\[\[(.+?)\]\]/g, "<a href='#$1'>$1</a>");
});
$(".test").html(function(i, html) {
  return html.replace(/\[img](.+?)\[\/img\]/g, "<img src='$1'>");
});

是否可以组合代码并创建独特的短代码封装阵列，然后将其对应的＆＃34;返回＆＃34;还有？我想添加诸如[aa] [/ aa]，[bb] [/ bb]等的附件...... 谢谢，抱歉我的英语：）

Answer 1

你可以链接.replace()的

[[Link1]] [[Link2]]
[img]http://www.w3schools.com/images/lamp.jpg[/img]

$(".test").html(function(i, html) {
  return html.replace(/\[\[(.+?)\]\]/g, "<a href='#$1'>$1</a>").replace(/\[img](.+?)\[\/img\]/g, "<img src='$1'>");
});

或

$(".test").html(function(i, html) {
  return html
      .replace(/\[\[(.+?)\]\]/g, "<a href='#$1'>$1</a>")
      .replace(/\[img](.+?)\[\/img\]/g, "<img src='$1'>")
});

非常清晰的可读性。

你也可以像这样构建局部变量

$(".test").html(function(i, html) {
  var buildhtml = html
      .replace(/\[\[(.+?)\]\]/g, "<a href='#$1'>$1</a>")
      .replace(/\[img](.+?)\[\/img\]/ig, "<img src='$1'>");

  while (buildhtml.match(/\[(b|i|u|strong|em)\](.*?)\[\/\1\]/i)) {
      buildhtml = buildhtml.replace(/\[(b|i|u|strong|em)\](.*?)\[\/\1\]/ig,"<$1>$2<\/$1>");
  }
  return buildhtml;
});

因为某些元素需要递归直到它们不再以bbml形式存在，并且在这个例子中，我们可以嵌套b / i / u / em / strong，但我们必须循环它以防万一一个嵌套在另一个中。

使用jquery创建短代码框的数组

1 个答案: