单击链接时用Javascript更改HTML？

问题描述：

比方说，我有一个名为“videoplayer”的DIV--在这个DIV里面是一个图像。单击链接时用Javascript更改HTML？

当单击链接时，是否有简单的方法来更改此DIV中的HTML代码？

例如，这是当前DIV：

<div class = "big_player" id="player1"> 
      <img src="whatever.jpg"> 
    </div>

当用户点击一个链接，我想要的HTML更改为：

<div class = "big_player" id="player1"> 
      <script> 
       playVideo(file, stream, key); 
      </script> 
    </div>

我有多个缩略图/链接（12总共）与所有不同的'文件，流，关键'变量。请参考here以供参考。

完成此操作的最简单最简单的方法是什么？

它可以用jQuery轻松完成，但文件，流，密钥从哪里来？ – j08691 2013-04-25 21:51:26

欢迎来到[SO];阅读[faq]。当您现有的问题没有获得足够的流量时，正确的解决方案是将其编辑为更好的问题。简单地重新发布相同的问题是不可接受的。 – zzzzBov 2013-04-25 21:54:31

答

是的，这很简单。

var div = document.getElementById("player1"); 
div.onmousedown = function() { 
    div.innerHTML = "stuff!" 
};

的jsfiddle：（点击测试）http://jsfiddle.net/yjdfg/

答

可以使这样的功能：

function changeDiv(divID) { 
    var div_to_change = document.getElementById(divID); 
    div_to_change.innerHTML = 'whatever you want here'; 
}

与

<a onClick="changeDiv('player1')" href="#">Click to change div</a>

答

叫我相信你想运行点击脚本：

$('#player1').click(function(){playVideo(file, stream, key);});

这对他们中的一个（player1）有效，你需要为剩下的工作。请注意，例如，您还必须定义您的函数参数（文件，流，键）或从div属性中获取它们。如果它们是动态的，则使用on而不是click。

但是，如果你真的想改变div的内容（无论是什么原因），这是把点击功能中的代码：

var html_code = "<script>playVideo(file, stream, key);</script>"; 
$('#player1').html(html_code);

编辑

参观后您的网站，我注意到你没有点击大分区来改变它的内容，而是其他的。在这种情况下，正确的选择器是#miniplayer1,#miniplayer2等，以便原始代码变为$('#miniplayer1').click(function(){playVideo(file, stream, key);});

单击链接时用Javascript更改HTML？

相关推荐