Question

对于一个小小的webapp，我使用JS将字符串中的url更改为可点击的url，同时更改url以说“点击此处”＃。然而问题是，如果我保持URl相同，而不将其更改为“点击此处”＆＃39;一切正常。但如果我更改它，可点击链接会链接到错误页面：

未找到

请求的网址/client/http://www.google.com'   在此服务器上找不到target =＆＃39; _blank＆＃39;＆gt;点击此处。

以下是我使用的代码（无需更改为＆＃39;点击此处＆＃39;）

 $('.discussion').ready(function(){

    $('.discussion #messages p').each(function(){

      var str = $(this).html();

        var regex = /(https?:\/\/([-\w\.]+)+(:\d+)?(\/([\w\/_\.]*(\?\S+)?)?)?)/ig

        var replaced_text = str.replace(regex, "<a href='$1' target='_blank'>$1</a>");

        $(this).html(replaced_text);


   });
});

这是我想要工作的那个，但却给出了错误：

$('.discussion').ready(function(){

    $('.discussion #messages p').each(function(){

      var str = $(this).html();

        var regex = /(https?:\/\/([-\w\.]+)+(:\d+)?(\/([\w\/_\.]*(\?\S+)?)?)?)/ig

        var replaced_text = str.replace(regex, "<a href='$1' target='_blank'>tap here</a>");

        $(this).html(replaced_text);


   });
});

[编辑]，这是HTML

<ol class="discussion" scroll-bottom="replies">
    <div ng-class="getClass($index)" ng-repeat="reply in replies track by $index">
      <li ng-repeat="item in reply.text.replace('?','.').replace('!','.').split('. ') track by $index" class="fix-clutter">
        <div class="avatar">
          <img ng-src="{{reply.avatar}}">
        </div>

        <div id="messages" class="animated slideInUp">

          <p class="animated fadeInUp">{{item}}</p>

        </div>
       </li>
    </div>
  </ol>

Answer 1

我在此处复制并粘贴了您的代码：http://plnkr.co/edit/CK2vJdeIxtN1Bvt7Kce5?p=preview，其中包含以下HTML：

<div class="discussion">
  <div id="messages">
    <p>
      http://stackoverflow.com/questions/32395188/changing
    </p>
    <p>
      http://stackoverflow.com/questions/32395188/changing
    </p>
  </div>
</div>

在这个特定场景中，一切都运作良好。你可以粘贴你的HTML吗？然而，正则表达式它无法正常工作。如果在URI上添加“破折号”，则正则表达式无法获取完整的URI，并且它会破坏破折号。

更新：我再次检查了...问题是由正则表达式规则引起的90％。

另一种破坏的情况是当你已经在html上使用“href tag”作为下面代码的链接时：

<div class="discussion">
  <div id="messages">
    <p>
      <a href="http://stackoverflow.com/questions/32395188/changing'>LINK</a>
    </p>
  </div>
</div>

将字符串中的URL更改为可点击链接，同时更改其值

1 个答案: