Javascript - 单击时启动计时器以交换按钮/图像并显示内容柜

Question

我完全是个菜鸟，很抱歉，

我想做的是，在我的 Wordpress 博客上有一个按钮/图片:src="http://Mysite.com/Images/Button.png"我希望当用户单击此图像时发生 2 件事 - 1. 为了弹出我的内容储物柜，我相信我已经有了正确的代码？:

 onclick="var fileref=document.createElement('script');fileref.setAttribute('type','text/javascript'); fileref.setAttribute('src', 'http://MYCONTENTLOCKER.com/guid?:1234567890')

要触发此内容锁，整个操作需要有一个 ID，例如'ID="按钮1'

还有 2. 使计时器启动 30 秒。

当该计时器结束时，我希望将原始按钮/图像替换为不同的按钮/图像。当它被点击时，我希望按钮下方出现一个文本字符串 - 说些什么，例如'你已经完成了这部分'

我知道这个问题很多，如果有人帮助我，我将非常感激!

谢谢!哈利。

Answer 1

您可以通过以下方式设置延迟:

setTimeout(someFunction,30000);

这将在 30 秒(30000 毫秒)后运行该函数。

您应该将按钮包裹在一个 span 或其他东西中，然后您可以获得容器元素并像这样替换按钮/图像:

function someFunction() {
  document.getElementById('container_name').innerHTML = '<button onclick="do something">A new button</button>';
}

在此图像下方放置一个空跨度并对其执行相同的操作:

function someFunction() {
  document.getElementById('container_name').innerHTML = '<button onclick="do something">A new button</button>';
  document.getElementById('message').innerHTML = 'You have completed this part!';
}

虽然我不知道如何做第一部分。