如何在页面加载时动态更改href内容

Question

我想在网络浏览器上运行mp4视频。 为此，我正在使用流播放器，并且我想在页面加载时动态更改href内容。 我用下面的代码。

<html><head>
<title>Wow! This is video</title>

<script src="http://releases.flowplayer.org/js/flowplayer-3.2.13.min.js" type="text/javascript"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

<script type="text/javascript">

    $(document).ready(function () {
        //var Filename = document.getElementById("<%=hdnFileName.ClientID%>").value;
        var Filename = "http://www.yahoo.com";

        $("a.mylink").attr("href", Filename);
    });
</script></head><body>


<!-- <a href="Video/Test.mp4" style="width: 500px; height: 400px;" id="A"></a>-->
<a href="Video/Test.mp4" style="width: 500px; height: 400px; margin: 10px; display: block" class="Test1" id="Test1"></a>
<script language="JavaScript" type="text/javascript">
    flowplayer("Test1", "http://releases.flowplayer.org/swf/flowplayer-3.2.18.swf");
</script></body></html>

在这里，我将外部传递锚标记的值，我想将其设置为锚标记。 但是上面的代码是行不通的。 你能帮忙吗？

Answer 1

我知道有两种方法可以实现您想要的

第一：不要将href属性设置为HTML中的任何属性，然后使用js进行设置

HTML代码：

<a style="width: 500px; height: 400px; margin: 10px; display: block" class="Test1" id="Test1"></a>

JS代码：

document.getElementById("Test1").setAttribute("href", Filename);

第二个：创建一个新标签，并用该标签替换该标签

JS代码：

 var Filename = "http://www.yahoo.com"; var aTag = document.createElement("a"); aTag.style.width = "500px"; aTag.style.height = "400px"; aTag.style.display = "block"; aTag.classList.add("Test1"); aTag.setAttribute("href", Filename); aTag.id = "Test1"; document.getElementById("Test1").replaceWith(aTag)

Answer 2

工作代码：

<html>
<head>
<title>Wow! This is video</title>

<script src="http://releases.flowplayer.org/js/flowplayer-3.2.13.min.js" type="text/javascript"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

</head><body>


<!-- <a href="Video/Test.mp4" style="width: 500px; height: 400px;" id="A"></a>-->
<a href="Test.mp4" style="width: 500px; height: 400px; margin: 10px; display: block" class="Test1" id="Test1"></a>
<script language="JavaScript" type="text/javascript">
  file = "http://techslides.com/demos/sample-videos/small.mp4";//any sample file you want
  $("a").attr("href",file);
  flowplayer("Test1", "http://releases.flowplayer.org/swf/flowplayer-3.2.18.swf"); 
</script></body></html>

您可能只是想知道为什么这行得通，而不是您的行之有效。 所以这就是原因。

您正在做的两个大错误：

mylink？ 它无处。 如果使用$（“＃Test1”）或$（“。Test1”），效果更好
文档准备就绪后，您正在加载脚本。 这意味着，如果您调试代码或查看页面源，您会发现您的href已更新，但仅播放旧视频。 要更正它，您需要设置没有ready函数的属性。 仍然不起作用，因为如果您在顶部编写它，它将被实际的href属性覆盖。
不是Yahoo.com的mp4视频。 您提供的属性确保是视频。

如何在页面加载时动态更改href内容

问题描述

2 个解决方案

解决方案1
0 2018-06-25 08:15:49

解决方案2
0 2018-06-25 08:39:21

如何在页面加载时动态更改href内容

问题描述

2 个解决方案

解决方案1 0 2018-06-25 08:15:49

解决方案2 0 2018-06-25 08:39:21

解决方案1
0 2018-06-25 08:15:49

解决方案2
0 2018-06-25 08:39:21