Question

好的，先关闭。没有jquery，没有ajax，只是纯粹的javascript。我在名为text.html的页面上有以下代码。

<html><body>
<script>
function live(ID,txt2) {
    var a = document.getElementById(ID);
    a.innerHTML = (txt2);
}
setInterval(live, 250);
a.innerHTML =(txt2);
</script>
<div id="txt1">Live</div><p />
</body></html>

我在live2.html上有以下代码

<html>
  <body>
<p />
<iframe width="400" height="50" src="text.html" name="frameA" id="frameA"></iframe><p />        
<input type="button" value="Live" onClick="document.getElementById('frameA').contentWindow.live('txt1','L I V E')">
<input type="button" value="Rebroadcast" onClick="document.getElementById('frameA').contentWindow.live('txt1','Rebroadcast')"><br />
 <a href="text.html" target="frameA">text</a>
 </body>
</html>

当前代码通过更新iframe中的信息完全按照我的意愿运行。我的问题是这个。如果有人直接访问text.html，我希望他们能够看到我已将该文档更改为的内容。例：我点击一个按钮，iframe中的文字现在说重播。其他人访问text.html，他们也看到了重播。如果他们在查看text.html时，我点击了实时按钮，text.html页面将更新为live字样。我也可以对此进行PHP脚本编写。我已经尝试过jquery并且遇到了让它正常工作的问题，而且我并没有真正的知识或访问权来实现其他任何东西。这是一个正在进行的项目。我希望，最终结果将是一个iframe，我可以更新，而不是实际上在框架所在的同一页面上。（同域域）内容将是从图像，到youtube嵌入和图片的任何内容。我正在努力更全面地了解这种语言是如何工作的，这就是为什么我一步一步地采取这种方式。我没有访问教程或查看预先制定的解决方案的问题。谢谢你的帮助。：）

Answer 1

我想我可能错过了一些东西。用户将始终看到文本“Live”，因为这是text.html中的硬编码。如果您通过JavaScript更改文本无关紧要，因为它只会影响您所看到的浏览器。您需要将其保存到持久性存储（即数据库）并在页面上动态显示它。

Answer 2

live2.html可以使用AJAX将更改发送到服务器，然后可以更新live.html。但这是一种糟糕的方式，因为这意味着live.html的内容在版本控制和/或内容管理系统之外更新。正如suke所说，最好使用真实的数据库并动态生成页面。

Answer 3

首先，当学习编程语言的人没有完全理解语言可以做什么和不能做什么时会发生什么。最初的想法是让特定的一群人知道什么时候重播或者节目现场直播。我希望控制何时更改该信息仅供管理员使用。最终，整个想法都被废弃了，完全不切实际。基本上，解决方案并不存在于我想要实现这一目标的环境中。多年后... 解决方案是使用CSS在div标签内进行实时和重播。然后使用JavaScript函数将div的属性更改为隐藏或显示。按钮或链接需要与实时或转播文本存在于同一页面上。这也意味着不需要单独的框架。要从页面外部控制此元素，只能通过在其他位置存储值并定期检查该值来完成。 JSFiddle

剧本：

var x = document.getElementById("txt1");
var y = document.getElementById("txt2");


function htext() {
    x.style.visibility = 'visible';
    y.style.visibility = 'hidden';
}

function stext() {
    x.style.visibility = 'hidden';
    y.style.visibility = 'visible';
}

function ctext() {
    var z = getComputedStyle(x).getPropertyValue("visibility");
    if (z != 'hidden') {
        stext();
    } else if (z != 'visible') {
        htext();
    }
}

CSS：

#txt1 {
    visibility: hidden;
    margin-left:0px;
}
#txt2 {
    visibility:visible;
    margin-left:0px;
}

HTML：

<span id="txt1">Live</span>

<span id="txt2">Rebroadcast</span>

<br />
<a href="javascript://" onclick="ctext();">click</a>

说实话。我不完全确定在其他地方存储信息所需的编程，并检查某些条件是否属实。上面的程序将基本上隐藏和显示div。我可能更进一步，使用JQuery创建和删除实际的div本身。最后，这基本上接近我最终使用的解决方案，然后放弃并放弃项目。

页面上的自动更新功能结果

3 个答案: