使按鈕在Express.js應用程序中工作

-1

我想將按鈕添加到簡單的Web應用程序，但是我不知道如何使其工作。我正在使用Node，express，ejs。我有兩個主要問題：使按鈕在Express.js應用程序中工作

我想使發生的是，當我按一下按鈕，就應該我重定向到一個不同的頁面「/ APPLIST」其中有我的所有應用程序的列表。
我想添加一個圖像，它不顯示，只是替代文字出現。圖像是在所示的相同的文件夾。圖像大小爲679x1178像素。

有一個自動生成的app.js當然包含所有必需的模塊。以下文件分別是（index.js，style.css，index.ejs）。

var express = require('express'); 
 
var router = express.Router(); 
 

 
/* GET home page. */ 
 
router.get('/', function(req, res, next) { 
 
    res.render('index', { 
 
    title: 'Welcome to AJ homepage' 
 
    }); 
 
}); 
 

 
module.exports = router;

@import url(https://fonts.google.com/specimen/Fjalla+One?selection.family=Fjalla+One); 
 
body { 
 
    padding: 50px; 
 
} 
 

 
a { 
 
    color: #00B7FF; 
 
} 
 

 
h1 { 
 
    font-family: cursive; 
 
    position: relative; 
 
    font: "" 
 
} 
 

 
.btn { 
 
    position: relative; 
 
    bottom: 10px; 
 
    top: 10px; 
 
} 
 

 
p { 
 
    position: relative; 
 
    top: 30px; 
 
    font-size: 20px 
 
}

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <title> 
 
    <%= title %> 
 
    </title> 
 
    <link rel='stylesheet' href='/stylesheets/style.css' /> 
 
    <link rel='stylesheet' href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
</head> 
 
<div class="modal-body row"> 
 
    <div class="col-md-6"> 
 

 

 
    <body> 
 
     <h1> 
 
     <%= title %> 
 
     </h1> 
 
     <button class="btn" type="button">My Applications</button> 
 
     <p>MY INFO </p> 
 
    </body> 
 

 
    </div> 
 

 
    <div class="col-md-6"> 
 
    <img src="../public/images/arjun.jpg.jpg" alt="My Photo" class="img-responsive"> 
 
    </div> 
 
</div> 
 

 
</html>

來源

2017-02-27 Arjun Jain

如果您只是想將按鈕轉到其他頁面，請在您的HTML中使用類似'Clickable content here'的鏈接，當用戶單擊該內容時，瀏覽器將自動轉到其他頁面。如果您想要或幾乎任何其他HTML內容，您可以在該鏈接中放置一個按鈕。 – jfriend00

嘗試，你仍然應該能夠樣式它作爲一個按鈕。檢查此答案： How to create an HTML button that acts like a link? ，因爲它顯示其他選項，如使用<form>。此外，在您的快速代碼中，您將需要定義您想要服務的路線。

來源

2017-02-27 06:59:24

我不知道爲什麼你需要在這種情況下一個按鈕。我建議使用一個普通的錨鏈接：使用<a href="/my_applications">代替

<a href="/applist" class="btn">My applications</a>

來源

2017-02-27 06:56:17 jlowgren

<a href="/applist">您可以使用此錨標記而不是按鈕。這將重定向到您定義路由的您的applist頁面。

來源

2017-02-27 07:08:11

使按鈕在Express.js應用程序中工作

回答

相關問題