您如何通过用户输入使用 AJAX？

Question

我有一个项目来构建一个非常简单的网页，该网页将利用 AJAX 来显示结果。

在 main.py 我们有一个单词列表，

words = {
    'a': True,
    'aah': True,
    'aahed': True,
    'aahing': True,
    ..............
}

我们已经为我们定义了这个类：

class CheckWordHandler(webapp2.RequestHandler):
    def get(self):
        word = self.request.get('word')
        if word in words:
          self.response.out.write('true')
        else:
          self.response.out.write('false')
    def post(self):
        return self.get()

到目前为止，这是我唯一使用 AJAX 处理 index.html 的东西，每当您输入内容时，它只会显示一个新的随机数。我这样做只是为了了解它的工作原理。

function checkWord() {
    var xmlHttp = createXmlHttp();
    xmlHttp.onreadystatechange=function() {
        if(xmlHttp.readyState == 4) {
            var text = Math.random();
            var d = document.getElementById('texthere');
            d.innerHTML = text;
        }
    }     
    postParameters(xmlHttp, '/check', '');

}

但是我正在考虑如何使用 checkwordhandler 来显示用户是否正在输入列表中的单词。如何让处理程序检查用户输入？

我有一个表单，用户可以在其中输入任何内容

<form >
    Enter a word:<br>
    <input type="text" onkeypress="checkWord()" name="word">
    <br>
</form> 

那么，我将如何从这个表单中获取输入并使用 xml 检查它是否在单词列表中？

Answer 1

更改输入以发送用户输入的值：

onkeypress="checkWord(this.value)"

并更改 AJAX 函数以将值作为参数发送，并显示响应文本。

function checkWord(word) {
    var xmlHttp = createXmlHttp();
    xmlHttp.open('GET', '/check?word=' + encodeURIComponent(word), true);
    xmlHttp.onreadystatechange = function() {
        if(xmlHttp.readyState == 4) {
            var text = xmlHttp.responseText;
            var d = document.getElementById('texthere');
            d.innerHTML = text;
        }
    } 
    xmlHttp.send();
}