个人中心
gpt4 book ai didi

javascript - node.js 从 html 输入值

转载 作者：行者123 更新时间：2023-11-30 14:35:16 24 4
gpt4 key购买 nike

我目前正在用 node.js 制作一个应用程序，想找到一种从 html 获取输入的方法。目前，我想要一个下拉菜单来调用一个函数并将选择用作函数的输入。但是，当我尝试调用基本函数(如 console.log('hello world');)时，没有任何反应。我正在使用 http 模块创建一个服务器，并使用另一个函数将 html 返回给本地主机上的用户。这是我的代码片段。

const http = require('http');

http.createServer(function (req, res) {
    var html = buildGreeter(req);
    res.writeHead(200, {
        'Content-Type': 'text/html',
        'Content-Length': html.length,
        'Expires': new Date().toUTCString()
    });
    res.end(html);
}).listen(8080);
function buildGreeter(req) {
var test = 'Test test test   ';
var input = '<select onchange = "myFunc()"> <option> foo </option> <option> bar </option> </select>';
return '<!DOCTYPE html> <html><header></header><body>' + test + input + '</body></html>';
}
function myFunc(variable){
    console.log(variable);
}

我应该使用另一个模块吗？我知道很多在线示例都将数据发送到服务器(即通过 Ajax)，但由于我没有用于该项目的服务器，所以我不知道该解决方案的适用性如何。

提前感谢您的帮助!

最佳答案

我会使用 express输入npm i express即可安装node模块。下面是一个使用 express 设置服务器的示例，同时还实现了一些方法:

const express = require('express')
const renderHtml = require('./util').renderHtml // Render HTML function

let app = express() // Get instance of express server

app.get('/', renderHtml('index.html')) // Home page
app.get('/other', renderHtml('other.html') // Other page

const port = process.env.PORT || 3000
app.listen(port, function() {
  console.log(`Starting server on port ${port}`)
}

在另一个文件(我将其命名为 util.js)中，您可以编写在服务器上调用某些路径时要执行的函数。例如:

// Render any html file that I have in my './html' directory
exports.renderHtml = function (htmlFileName) {
  return function (req, res) { 
    res.sendFile(`./html/${htmlFileName}`)
  }
}

你可以像this example那样写一个下拉列表然后让 onChange 操作调用您在服务器中指定的另一个页面(例如，请参见第一个代码块)。

关于javascript - node.js 从 html 输入值，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/50518720/

24 4 0
文章推荐： c# - 将 GetBytes C# 行转换为 VB.Net
文章推荐： c# - 静默地从c#执行批处理文件
文章推荐： 代码在执行时不显示任何终止输出
文章推荐： c# - 动态传递对象类型
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com