Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/node.js/39.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何知道按下了哪个按钮?_Javascript_Node.js_Button_Express_Body Parser - Fatal编程技术网

Javascript 如何知道按下了哪个按钮?

Javascript 如何知道按下了哪个按钮?,javascript,node.js,button,express,body-parser,Javascript,Node.js,Button,Express,Body Parser,我正在学习node.js和express framework的基础知识。 我有一个带有两个按钮的简单页面: <form action="/home2" method="post"> <button name="butt1">butt1</button> <button name="butt2">butt2</button> </form> 在控制台里我看到了 undefined 如何访问按钮的名称?您可以

我正在学习node.js和express framework的基础知识。 我有一个带有两个按钮的简单页面:

<form action="/home2" method="post">
    <button name="butt1">butt1</button>
    <button name="butt2">butt2</button>
</form>
在控制台里我看到了

undefined

如何访问按钮的名称?

您可以使用的一个技巧是将这两个按钮用作提交按钮:

<form action="/home2" method="post">
    <button name="button_id" value="1" type="submit">butt1</button>
    <button name="button_id" value="2" type="submit">butt2</button>
</form>

巴特1
butt2

在服务器端,您现在应该将
按钮id的值设置为1或2,具体取决于单击的按钮。

我认为这将对您有所帮助

<form action="/home2" method="post">
   <button name="butt1">butt1</button>
   <button name="butt2">butt2</button>
</form>


router.post('/home2', function(req, res, next) {

  if(req.body.hasOwnProperty("butt1")){
     console.log("butt1 clicked");
  }else{
     console.log("butt2 clicked");
  }
  res.render('home2', { title: 'post' });
});

巴特1
butt2
router.post('/home2',函数(req、res、next){
if(请求主体hasOwnProperty(“butt1”)){
console.log(“butt1单击”);
}否则{
console.log(“butt2单击”);
}
res.render('home2',{title:'post'});
});

首先,既然您正在使用POST,我假设您已经有了body解析器中间件,如果没有检查的话

您的代码需要一些更改

在html中

<form action="/home2" method="post">
    <button name="butt" value='1'>butt1</button>
    <button name="butt" value='2'>butt2</button>
</form>
req.body.name
需要是
req.body.butt


/
必须是
/home2

我知道这是一个非常古老的问题,但我也有同样的问题,我找到了一个更好的解决方案,所以我想与大家分享。你可以在不同的按钮上添加不同的动作,并在你的应用程序中对动作执行不同的操作。例如:

<form action="/home2" method="post">
    <button formaction="wigglebutt" name="butt" value='1'>butt1</button>
    <button formaction="slapbutt" name="butt" value='2'>butt2</button>
</form>

你觉得怎么样?如果我得到的话,那就不是夏尔了。因此,我不能在一种形式中使用两个按钮,而只是读取上面写的内容?我之所以对此进行投票,有60%的原因是因为您将按钮命名为“butt1”和“butt2”。此外,在这里
console.log(req.body.name)
您没有包含名称的字段
name
router.post('/home2', function(req, res, next) {
    console.log(req.body.butt);
    res.render('home2', { title: 'post' });
});
<form action="/home2" method="post">
    <button formaction="wigglebutt" name="butt" value='1'>butt1</button>
    <button formaction="slapbutt" name="butt" value='2'>butt2</button>
</form>
app.post("/wigglebutt", (req, res) => {

});

app.post("/slapbutt", (req, res) => {

});