带 pug.js 的时间启用按钮

Question

嘿，我对哈巴狗还很陌生，想不出一种方法来启用按钮时间，所以用户在点击继续之前花时间阅读文本。我正在使用 express 应用程序和 pug 结合 bootstrap.css 作为模板。

哈巴狗文件：

html
    head
        link(rel='stylesheet' href=`${baseRoute}/bower_components/bootstrap/dist/css/bootstrap.css`)
    body
        .container
            form(method='GET' action=`${baseRoute}/nextSite`)                
                div
                    p.mb-4= 'someText'
                button.btn.btn-primary.float-right.mt-4(type='submit', id= 'btn') Next

Javascript（快递）

router.get('/start', (req, res) => {
  res.render('instruction', {
    baseRoute: 'the/base/route',
  });
});

不幸的是，我找不到任何资源来处理这个问题。

我的想法是通过 javascript 修改 pug 文件中的按钮，但我无法引用按钮元素

button.btn.btn-primary.float-right.mt-4(type='submit', disabled=true, id= 'btn') Next 
-console.log(btn); // undefined
-console.log(document.getElementById(btn); // document is undefined

这是正确的方法还是我遗漏了什么？提前致谢

Answer 1

好的，我知道了。哈巴狗文件：

                button.btn.btn-primary.float-right.mt-4(id='btn', type='submit', disabled=true ) Next
                script.
                    var button = document.getElementById('btn');
                    setTimeout(() => {button.disabled = false;}, 3000);

带 pug.js 的时间启用按钮

Time enabled Button with pug.js

javascript

pug