Question

我是表达js（和节点js）的新手。我正在尝试在动态创建的按钮上实现onclick侦听器。这是我的代码

Native.pug

doctype html
html
    head
        title="div dude"
    body
        div.main#main(style="height:300px;width:800px;border-style: solid;border-color: #ff0000 #0000ff;padding:10px")
            each prod in product_name
                //
                   Created by krishna on 19/5/17.
                div.child1#child1(style="float:left;height:280px;width:30%;border-style: solid;border-color: #ff0000 #0000ff;margin:10px")
                    p.greetings#people1 Hello World!
                    p.id#id #{prod.id}
                    p.name#name #{prod.name}
                    p.price#price #{prod.price}
                    button.send#send(onclick='senddata()') Add to Cart

script(src='/javascripts/try.js')

try.js

function senddata() {
    document.getElementById("send").innerHTML = "YOU CLICKED ME!";
}

index.js

var express = require('express');
var app = express({mergeParams: true});

var products = [
    {
        place1:[
            {id: 1, name: "choc1", price: 20},
            {id: 2, name: "choc2", price: 30}
        ],
        place2:[
            {id: 1, name: "coffee", price: 50}
        ],
        place3: [
            {id: 1, name: "oil1", price: 10},
            {id: 2, name: "oil2", price: 60},
            {id: 3, name: "oil3", price: 70}
        ]
    }
];

app.get('/:place/:id([0-9]{1,})', function(req, res){
    if (products[0][req.params.place] === undefined)
        res.send("place doesnt exist");
    else {
        if (products[0][req.params.place][req.params.id - 1] === undefined)
            res.send ("id doesnt exist");
        else {
            console.log(products[0][req.params.place][req.params.id-1]);
            res.render('small_div.pug', {product_name:products[0][req.params.place][req.params.id-1]});
        }
    }
});

app.get('/:place', function (req, res) {
   res.render('native.pug', {product_name:products[0][req.params.place]});
});

module.exports = app;

当我点击按钮时，只有第一个按钮有效。其余的人都行不通。也没有显示错误。

请帮忙。

由于

Answer 1

终于明白了。

当我尝试在javascript中使用getElementById时，它只查找id为'send'的第一个元素。由于所有元素都是动态创建的，因此所有元素都有id发送。

所以，我只是将id更改为{prod.id}，这是唯一的，然后将其传递给onClick的函数。问题解决了。

如何在节点js中为动态创建的按钮获取按钮操作？

1 个答案: