Question

如何使用快速js显示输入搜索的结果？

我定义了两条路线：

app.get('/', function(req, res){
res.render('index',{
title: "Bilingual Dictionary"
  });
});

然后我调用此路线显示搜索结果：

app.post('/word', function(req, res){
var search= req.body.name;
res.render('index', {
title: "Bilingual Dictionary",
search: search
  });

});

在我的index.ejs中，我有：

 <h1><%= title %></h1>

 <form id="create-form">
  <input type="text" id="create-input">
  <button>Search</button>
</form>
 <div>

 <%= search %>
 </div>

我收到错误：未定义搜索。

如果我将第二条路线更改为：

app.post('/word', function(req, res){
res.send(search)
});

搜索结果成功返回但发送到控制台。所以我知道我的ajax调用（在一个单独的scripts.js中）工作正常。

Answer 1

对于那些有同样问题的人，我找到了解决方案。首先，我必须将视图引擎更改为PUG（但实际上并不重要）。然后我更改了发送表单的脚本：

$(function(){
$('form').submit(function(event){
   event.preventDefault();
 var parameters = { search: $('#searchbox').val() };
   $.get( '/searching',parameters, function(data) {
     console.log(data);
   $('#results').html(data);
   });
  });
  });

为了显示输入数据，我添加了最后一行： $（ '＃结果'）的html（数据）;

然后在app.js中我按如下方式修改了路线：

app.get('/searching', function(req, res){
var val = req.query.search;
res.send(val);

现在，当我进入端口3000并输入一个单词时，它会显示在同一页面上。

表达js路由：在ejs页面中显示用户输入

1 个答案: