Question

我得到＆＃34;未捕获的TypeError：无法读取属性＆＃39;值＆＃39; of null＆＃34;当我检查Chrome中的代码时。它是一个简单的自动填充，预先搜索框。这是完整的错误消息： error message

这是Server.js代码。

＆＃13;

var express=require('express');
var app=express();
var  mysql=require('mysql');
var connection = mysql.createConnection({
  host     : 'localhost',
  user     : 'root',
  password : '',
  database : 'mydb'
});
connection.connect();
app.set('views',__dirname + '/views');
app.use(express.static(__dirname + '/JS'));
app.set('view engine', 'ejs');
app.engine('html', require('ejs').renderFile);
app.get('/',function(req,res){
res.render('index.html');
});
app.get('/search',function(req,res){
connection.query('SELECT name FROM mydb.products WHERE name LIKE "%'+req.query.key+'%"', function(err, rows, fields
) {
          if (err) throw err;
    var data=[];
    for(i=0;i<rows.length;i++)
      {
        data.push(rows[i].first_name);
      }
      res.end(JSON.stringify(data));
        });
});
var server=app.listen(3000,function(){
console.log("We have started our server on port 3000");
});

＆＃13;

这是html：

＆＃13;

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example of Twitter Typeahead</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script  type="text/javascript" src="typeahead.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('input.typeahead').typeahead({
        name: 'typeahead',
        remote: 'http://104.154.96.187:3000/search?key=%QUERY',
        limit: 10
    });
});
</script>
<style type="text/css">
.bs-example{
        font-family: sans-serif;
        position: relative;
        margin: 50px;
}
.typeahead, .tt-query, .tt-hint {
        border: 2px solid #CCCCCC;
        border-radius: 8px;
        font-size: 24px;
        height: 30px;
        line-height: 30px;
        outline: medium none;
        padding: 8px 12px;
        width: 396px;
}
.typeahead {
        background-color: #FFFFFF;
}
.typeahead:focus {
        border: 2px solid #0097CF;
}
.tt-query {
        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
}
.tt-hint {
        color: #999999;
}
.tt-dropdown-menu {
        background-color: #FFFFFF;
        border: 1px solid rgba(0, 0, 0, 0.2);
        border-radius: 8px;
        box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
        margin-top: 12px;
        padding: 8px 0;
        width: 422px;
}
.tt-suggestion {
        font-size: 24px;
        line-height: 24px;
        padding: 3px 20px;
}
.tt-suggestion.tt-is-under-cursor {
        background-color: #0097CF;
        color: #FFFFFF;
}
.tt-suggestion p {
        margin: 0;
}
</style>
</head>
<body>
   <div class="page-header">
        <h1>Ajax Search Box using Node and MySQL <small>Codeforgeek Tutorial</small></h1>
    </div>
    <div class="bs-example">
        <input type="text" name="typeahead" class="typeahead tt-query" autocomplete="off" spellcheck="false" placeholder="Type your Query">
    </div>
</body>
</html>

＆＃13;

未捕获的TypeError：无法读取属性＆＃39;值＆＃39; of null jquery.min.js

0 个答案: