Question

我是Javascript的新手。我希望显示一个简单的表单，以及顶部的图像，并在提交时发送参数。表单本身很好用，但是我找不到在顶部显示图片的方法..应该超级简单吗？这是我的代码：

var https = require('https');
var fs = require('fs')
var path = require('path')
url = require('url');

var qs = require("querystring");
var StringBuilder = require("stringbuilder");

const port = Number(process.env.PORT || 9000);

function getCalcHtml(req, resp, data) {


    var sb = new StringBuilder({ newline: "\r\n" });
    sb.appendLine("<html>");
    sb.appendLine(" <body>");

   // sb.appendLine(img);
 sb.appendLine("    <img src=\"./myimage.jpeg\" height=\"100\" width=\"100\">"); // NOT WORKING, shows an empty square
    sb.appendLine("     <form method='post'>");
    sb.appendLine("         <table>");
    sb.appendLine("             <tr>");
    sb.appendLine("                 <td>Serial Number: </td>");

    if (data && data.txtFirstNo) {
        sb.appendLine("                 <td><input type='text' id='txtFirstNo' name='txtFirstNo' value='{0}'/></td>", data.txtFirstNo);
    }
    else {
        sb.appendLine("                 <td><input type='text' id='txtFirstNo' name='txtFirstNo' /></td>");
    }

    sb.appendLine("             </tr>");
    sb.appendLine("             <tr>");
    sb.appendLine("                 <td> level: </td>");

    if (data && data.txtSecondNo) {
        sb.appendLine("                 <td><input type='text' id='txtSecondNo' name='txtSecondNo' value='{0}'/></td>", data.txtSecondNo);
    }
    else {
        sb.appendLine("                 <td><input type='text' id='txtSecondNo' name='txtSecondNo' /></td>");
    }

    sb.appendLine("             </tr>");
    sb.appendLine("             <tr>");
    sb.appendLine("                 <td><input type='submit' value='Submit value' /></td>");
    sb.appendLine("             </tr>");


    sb.appendLine("         </table>");
    sb.appendLine("     </form>")
    sb.appendLine(" </body>");
    sb.appendLine("</html>");

    sb.build(function (err, result) {
        resp.write(result);
        resp.end();
    });
}

function getCalcForm(req, resp, data) {
    resp.writeHead(200, { "Content-Type": "image/gif" });
    getCalcHtml(req, resp, data);


 // NOT WORKING
  //   var img = fs.readFileSync('./myimage.jpeg');
  //   resp.writeHead(200, {'Content-Type': 'image/gif' });
   //  resp.end(img, 'binary');
}

function post(req, resp, data) {
    resp.writeHead(200, { "Content-Type": "text/html" });
    //getCalcHtml(req, resp, data);
    // do a POST request
// create the JSON object
jsonObject = JSON.stringify({
    "SerialNumber": data.txtFirstNo.toString(),

    "Joints" : 45

});

  // do the POST call
  // works fine
  // etc

}

function getHome(req, resp) {
    resp.writeHead(200, { "Content-Type": "text/html" });
    resp.write("<html><html><head><title>Home</title></head><body>Test Form Click <a href='/calc'>here</a></body></html>");
    resp.end();
}

function get404(req, resp) {
    resp.writeHead(404, "Resource Not Found", { "Content-Type": "text/html" });
    resp.write("<html><html><head><title>404</title></head><body>404: Resource not found. Go to <a href='/'>Home</a></body></html>");
    resp.end();
}


http.createServer(function (req, resp) {
    switch (req.method) {
        case "GET":
            if (req.url === "/") {
                getHome(req, resp);
            }
            else if (req.url === "/calc") {
                getCalcForm(req, resp);
            }
            else {
                get404(req, resp);
            }
            break;
        case "POST":
            if (req.url === "/calc") {
                var reqBody = '';
                req.on('data', function (data) {
                    reqBody += data;
                    if (reqBody.length > 1e7) { //10MB
                        resp.writeHead(413, 'Request Entity Too Large', { 'Content-Type': 'text/html' });
                        resp.end('<!doctype html><html><head><title>413</title></head><body>413: Request Entity Too Large</body></html>');
                    }
                });
                req.on('end', function () {
                    var formData = qs.parse(reqBody);
                    getCalcForm(req, resp, formData);
                    Post(req,resp,formData);
                });
            }
            else {
                get404(req, resp);
            }
            break;
        default:
            get405(req, resp);
            break;
    }
}).listen(port);

Answer 1

可能是因为img标签没有关闭。如果你想在行中使用img，你应该在关闭img标签之前键入一个斜杠：<img src =... />

对不起，但我现在无法自己测试，但另一个问题可能是这个StringBuilder如何处理斜杠，验证你是否需要转义这个角色。

在javascript

1 个答案: