Question

好的，这应该是节点上的一个简单问题。

使用express，一个有一个名为app.js的文件，另一个有一个index.jade，还有一个index.js，通常是另一个javascript，比如server.js，其中服务器的大部分工作完成了（这里的代码可以在app.js中，但我们可以说这些是不同的文件。）

说我有两个像这样的对象

myIDs   = ['afoo', 'abar'];
myArray = ['foo', 'bar'];

在server.js中的

我希望在jade中迭代它们的元素，并创建分别具有值foo和bar的按钮，它们的id分别为afoo和abar。我们怎么能这样做呢？

此外，如果在其中一个按钮中发生鼠标点击，是否可以实现？我试图通过使用类似

之类的东西为我动态创建的特定按钮命名

html = "<button id=\"aUniqueID\">Press me!</button>"
document.getElementById('puff').innerHTML = html;

但是，即使它出现在浏览器中，按下按钮也没有任何反应（我正在向服务器发送消息，服务器应该打印控制台日志）。

任何帮助都将不胜感激。

Answer 1

我建议您不要使用内联函数，我会在客户端附加click事件，但您可以像使用jade一样内联添加内联

这假设每个按钮的值和id位于相同的数组位置：

myIDs   = ['afoo', 'abar'];
myArray = ['foo', 'bar'];

each button_id, i in myIDs
    button(id="#{button_id}", onclick="yourFunctionHere();") #{myArray[i]}

更新：

将数组传递给.jade页面就像：

app.get('/your-url-path', function(req, res){

    var my_ids_array = ['afoo', 'abar'];
    var my_values_array = ['foo', 'bar'];

    res.render('your-jade-page', { myIDs: my_ids_array, myArray: my_values_array });
});

express和jade：循环并创建动态id

1 个答案: