首页 > 解决方案 > Html 语言如何将文本更改为 LINK

问题描述

我有一个html code. 您能帮我编写代码,以便我可以将普通文本转换为link. 基本上我想更改显示在LINK-COLUMN其中的文本会像link现在它只是文本一样做出反应。

我正在尝试,但没有发现任何帮助。我是 Html 编程的新手。

HTML 页面预览链接

$(function() {


  var people = [];

  $.get('https://api.myjson.com/bins/c307c', function(data) {
    $.each(data.video, function(i, f) {

      var tblRows = "<tr>" + "<td>" + f.Id + "</td>" +
        "<td>" + f.video + "</td>" + "<td>" + f.date + "</td>" + "<td>" + f.time + "</td>" + "<td>" + f.video + "</td>" + "<td>" + f.image + "</td>" +
        "<td>" + f.videoDuration + "</td>" + "<td>" + f.liveStatus + "</td>" + "<td>" + "https://www.youtube.com/embed/" + f.video + "</td>" + "<td><div><img src=" + f.image + "></div></td>" + "</tr>"
      $(tblRows).appendTo("#userdata tbody");

    });

  });

});
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>


<div class="wrapper">
  <div class="profile">
    <table id="userdata" width="50%" border="2">
      <thead>
        <th>ID</th>
        <th>VIDEO NAME</th>
        <th>DATE</th>
        <th>TIME</th>
        <th>VIDEO LINK</th>
        <th>VIDEO IMAGE</th>
        <th>DURACTION</th>
        <th>LIVE STATUS</th>
        <th>LINK </th>
        <th>PLAY</th>
      </thead>
      <tbody>

      </tbody>
    </table>

  </div>
</div>

标签: javascriptjqueryhtmljsonajax

解决方案


  <script>

   $(function() {


  var people = [];

  $.get('https://api.myjson.com/bins/c307c',function(data) {
      $.each(data.video, function(i, f) {

        var link = "https://www.youtube.com/embed/"+ f.video;
         var tblRows = "<tr>" + "<td>" + f.Id + "</td>" +
          "<td>" + f.video + "</td>" + "<td>" + f.date + "</td>" + "<td>" + f.time + "</td>" + "<td>" + f.video + "</td>" + "<td>" + f.image + "</td>" +
          "<td>" + f.videoDuration + "</td>" + "<td>" + f.liveStatus + "</td>" + "<td><a target='_blank' href='"+link+"'>"+link+"</a></td>"  + "<td><div><img src=" + f.image + "></div></td>" + "</tr>";
          $(tblRows).appendTo("#userdata tbody");

    });

  });

});
</script>

我刚刚在动态创建的 HTML 中添加了一个锚标记。我创建了一个链接变量并将其作为链接传递到该锚标记中,以避免链接添加重复。

如果要在新选项卡中打开链接,请将_blank 添加到锚标记,或者如果要在同一窗口中打开链接,请将其删除。


推荐阅读