Question

我对 html，express和node.js 刚接触，这是我目前正在Web应用程序中使用的技术，但是我很难提交表单。

这是我的表单（该表单是通过脚本创建的，因为其字段根据不同的因素而有所不同）：

$FormContainer.html('');

var $form = $('<form></form>');
$form.css("action", "/CreateRecordObject");
$form.css("method", "GET");
for (i in data.fields) {
    var $label = $('<strong/>').text(data.fields[i] + ": ");
    var $input = $('<input>');
    $input.css("name", data.fields[i]);
    $input.css("value", " ");
    $input.css("type", "text")
    $label.appendTo($form);
    $('<br>').appendTo($form);
    $input.appendTo($form);
    $('<br><br>').appendTo($form);
}

$('<input type="submit" value="submit">').appendTo($form);

$FormContainer.append($form);

此脚本在名为“ /NewRecord.html”的html文件中创建表单

在后端中，我有以下路线：

app.get('/CreateRecordObject', function(request, response){
  console.log("Inside the CreateRecordObject");
});

尽管如此，代码从不输入“ / CreateRecordObject”。实际上，按下 submit （提交）按钮之后，发生的一切是URL从http://436bb783.ngrok.io/NewRecord到http://436bb783.ngrok.io/NewRecord吗？在末尾添加该问号并重新加载网站。我究竟做错了什么？

Answer 1

action和method是属性，而不是CSS样式。请将您的代码更改为以下内容：

// $form.css("action", "/CreateRecordObject");
// $form.css("method", "GET");

$form.attr("action", "/CreateRecordObject");
$form.attr("method", "GET");

$FormContainer = $('#container');
var data = {fields: [1, 2, 3]};
$FormContainer.empty();

var $form = $('<form/>', {"action": "/CreateRecordObject", "method": "GET"});
for (i in data.fields) {
    var $label = $('<strong/>').text(data.fields[i] + ": ");
    var $input = $('<input>', {"name": data.fields[i], "value": "", "type": "text"});
    $label.appendTo($form);
    $('<br>').appendTo($form);
    $input.appendTo($form);
    $('<br><br>').appendTo($form);
}

$('<input type="submit" value="submit">').appendTo($form);
$FormContainer.append($form);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<div id="container"></div>

来源：http://api.jquery.com/attr/

使用Express，Node和JQuery提交表单

1 个答案: