Question

因此，我将尽可能简洁明了。我喜欢在电脑里看。

在我的网站上，我希望页面底部有一个宽框。

在此框中，我希望网站内部发生的事情以文本形式显示。

我了解如何制作jQuery事件（例如单击或悬停），吐出一些文本。我不明白的是如何使该文本进入包含10行的框中，一旦创建了第11行，第一行就会滑入空白处，以将其删除。

经过一番搜索，我发现了这一点，它越来越接近目标。

var caption = [
"User Entered Site",
"Loading SideBar",
"Code: 01011011",
"Whatever text",
"Whatever text"
];

var i = 0;
setInterval(function() {
$("#message-box").html(caption[i]);
i++;
if (i == caption.length){i=0;}
}, 3 * 1000);

这是我找到的代码的问题。它实际上是为屏幕底部的一系列更换笔尖而设计的。该文本将覆盖之前编写的文本。

尽管很明显我想指出，随着时间的流逝，此示例文本集应出现在此只读控制台区域中。我试着把.delay（1000）弄乱了。

我不需要变得复杂并为出现的文本编写真实事件，而是可以创建虚假事件-只是为了使事情顺利进行。只要我将主要思想编码为运行在这种“只读控制台”上的“假”系列“黑客式”代码，我就可以添加一些代码来我将来会创建的一个新事件（单击，拖动，重新排序等），并且虚假的黑客工具箱/控制台实际上会包含一些实际事件。

我可能只是在其中放置人造物品，以便对该特殊的艺术性“象征性后端”网站有所了解。非常感谢你们！

Answer 1

这可能是您要实现的目标的基础。它创建一个框，然后在其中显示随机消息，当列表达到10条消息时，将它们向上滚动（通过删除第一条消息）。我没有尝试对所有样式进行样式设置，您可以使其看起来更漂亮（并使用动画缓慢删除项目）。我还使用i上的计数器来限制它总共显示多少消息（因此该代码段不会永远运行），您可以在应用程序中将其删除。

var caption = [
"User Entered Site",
"Loading SideBar",
"Code: 01011011",
"Whatever text",
"Some other message"
];

var i = 0;
var h = setInterval(function() {
  // already 10 messages? if so, delete the earliest
  if ($("#message-box p").length == 10)
    $("#message-box p").first().remove();
  $("#message-box").append('<p>' + i + ': ' + caption[Math.floor(Math.random()*5)] + '</p>');
  i++;
  if (i == 20) clearInterval(h);}
, 1000);

#message-box {
   height: 400px;
   border: 1px solid black;
   }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="message-box"></div>

jQuery-随着时间的推移动态添加文本-“黑客箱”-“控制台”

1 个答案: