<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>nodeAjax</title>
</head>
<body>
<label>
输入用户名：
<input type="text" name="" id="userName">
</label>
<p class="tip" id="tip"></p>
<script>
var userName = document.getElementById('userName')
var tip = document.getElementById('tip')
userName.onblur = function() {
var yhm = userName.value
var XHR = new XMLHttpRequest()
XHR.onreadystatechange = function() {
if (XHR.readyState === 4) {
if (XHR.responseText == 'a') {
tip.innerHTML = '对不起，该用户被占用'
tip.className = 'wrong'
} else {
tip.innerHTML = '恭喜，该用户名可以用'
tip.className = 'right'
}
}
}
XHR.open('get', 'http://127.0.0.1:3000/checkUser?yhm='+yhm, true)
XHR.send()
}
</script>
</body>
</html>
main.js
var fs = require('fs')
var express = require('express')
var bodyParser = require('body-parser')
var nodeExcel = require('excel-export')
var app = express()
app.use(bodyParser.json())
app.use(bodyParser.urlencoded({ extended: false }))
app.get('/', function (req, res) {
fs.readFile('./index.html', function (err, data) {
if (err) {
res.writeHead(404, {
'Content-Type': 'text/html'
})
} else {
res.writeHead(200, {
'Content-Type': 'text/html'
})
res.write(data.toString())
}
res.end()
})
})
app.get('/checkUser', function (req, res) {
res.write(req.query.yhm)
res.end()
})
app.listen(3000)
console.log('listen：http://127.0.0.1:3000')
详细工程包
建议用jquery写ajax，用原生js写ajax难度有点大。
jQuery - AJAX get() 和 post() 方法。没使用缓存技术的话可以直接用post代替get。
Query $.post() 方法
$.post() 方法通过 HTTP POST 请求从服务器上请求数据。与$.get()方法的区别是$.post()可以发送参数到服务器，服务器进行处理后再放回数据
语法：$.post(URL,data,callback)
必需的 URL 参数规定您希望请求的 URL。
可选的 data 参数规定连同请求发送的数据。
可选的 callback 参数是请求成功后所执行的函数名。
注意：
实例：
$("button").click(function(){
$.post("demo_test_post.asp",
{
name:"Donald Duck",
city:"Duckburg"
},
function(data,status){
alert("Data: " + data + "\nStatus: " + status)
})
})
程序员书库w3c 问您解答。
