javascript - Html 语言如何将文本更改为 LINK
问题描述
我有一个html code
. 您能帮我编写代码,以便我可以将普通文本转换为link
. 基本上我想更改显示在LINK-COLUMN
其中的文本会像link
现在它只是文本一样做出反应。
我正在尝试,但没有发现任何帮助。我是 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>
解决方案
<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 添加到锚标记,或者如果要在同一窗口中打开链接,请将其删除。
推荐阅读
- elasticsearch - 弹性搜索 - 访问列表中元素的成员
- php - 仅显示选中的产品
- functional-programming - 在 Coq 中用连词结论拆分前提
- php - 验证php表单失败
- javascript - 从 node.js 返回一个 json 响应到前端。
- angular - 从可观察订阅Angular 6传递变量
- ionic-framework - 离子输入失去焦点事件中的应用程序冻结 - ionic 3
- c++ - 是否可以有一个向量指向其他向量的子集?
- r - 非线性回归与对数模型
- batch-file - 如何使用 Windows CMD(不是 powershell)搜索和替换文本文件中包含“=”字符的字符串