w-haiS 2019-09-18 21:22 采纳率: 64.3%
浏览 1487
已采纳

关于js函数调用不起作用的问题

今天在学习ajax的时候,按照课本上的步骤,但是最后没有任何效果


<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>search Suggest</title>
<script type="text/javascript" src="/js/ajax.js"></script>
<script type="text/javascript">

    var trSrc;
    //设置下拉提示框的位置
    function setDivPosition() {
        alert("error");
        var input = document.getElementById("inputWord");
        var listdiv = document.getElementById("wordsListDiv");
        listdiv.style.left = (input.offsetLeft)+"px";
        listdiv.style.border = "blue 1px solid";
        listdiv.style.top = (input.offsetTop+input.offsetHeight)+"px";
        listdiv.style.width = (input.offsetWidth)+"px";
    }
    function search() {
        alert("search?");
        var inputWord = document.getElementById("inputWord").value;
        var url = "SearchSuggest";
        var params = "inputWord="+inputWord;
        sendRequest(url,params,"POST",display);
    }
    function display() {
        alert("display?");
        if(httpRequest.readyState == 4){
            if(httpRequest.status == 200){
                var xmlDoc = httpRequest.responseXML;
                clearDivData();
                changeDivData(xmlDoc);
            }else{
                alert("您请求的界面有异常!");
            }
        }
    }

    // 清除下拉框中的数据
    function clearDivData(){
        alert("clearDiv");
        var tbody = document.getElementById("wordsListTbody");
        vat trs = tbody.getElementsByTagName("tr");
        for(var i=trs.length-1;i>0;i--){
            tbody.removeChild(trs[i]);
        }
    }

    // 设置用户选中条目的背景色
    function setBgColor() {
        if(trSrc){
            trSrc.style.backgroundColor = "white";
        }
        trSrc = event.srcElement;
        trSrc.style.backgroundColor = "gray";
    }

    // 将用户选中的条目显示在文本框中
    function setText(){
        alert("setText");
        document.getElementById("inputWorld").value = trSrc.firstChild.data;
        document.getElementById("wordsListDiv").style.visibility = "hidden";
    }

    // 实际将数据加入下拉提示框
    function changeDivData(xmlDoc) {
        alert("changeDiv");
        var words = xmlDoc.getElementsByTagName("word");
        var tbody = document.getElementById("wordsListTbody");
        for(i=0;i<words.length;i++){
            var newTr = document.createElement("tr");
            var newCell = document.createElement("td");
            var wordText = words[i].firstChild.data;
            var textNode = document.createTextNode(wordText);
            newCell.onmouseover = setBgColor;
            newCell.onclick = setText;
            newCell.appendChild(textNode);
            newTr.append(newCell);
            tbody.appendChild(newTr);
        }
        if(words.length>0){
            document.getElementById("wordsListDiv").style.visibility = 'visible';
        }else{
            document.getElementById("wordsListDiv").style.visibility = 'hidden';
        }
    }


</script>
</head>
<body onload="setDivPosition()">
<p>搜索字符串:<input type="text" id="inputWord" onkeyup="search()"></p>
<div id="wordsListDiv" style="position:absolute;visibility:hidden">
    <table id="worksListTable">
        <tbody id="wordsListTbody"><tr><td>test</td></tr></tbody>
    </table>
</div>

</body>
</html>

其中就是body标签调用的onload,然后文本框调用了onKeyUp,在两个函数里面都加了一条alert语句,然后运行的时候还是什么反应都没有,求大佬给看一下是什么原因

  • 写回答

2条回答

  • 天际的海浪 2019-09-18 22:45
    关注

    有一处 var 写成了 vat

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

悬赏问题

  • ¥88 找成都本地经验丰富懂小程序开发的技术大咖
  • ¥15 如何处理复杂数据表格的除法运算
  • ¥15 如何用stc8h1k08的片子做485数据透传的功能?(关键词-串口)
  • ¥15 有兄弟姐妹会用word插图功能制作类似citespace的图片吗?
  • ¥200 uniapp长期运行卡死问题解决
  • ¥15 请教:如何用postman调用本地虚拟机区块链接上的合约?
  • ¥15 为什么使用javacv转封装rtsp为rtmp时出现如下问题:[h264 @ 000000004faf7500]no frame?
  • ¥15 乘性高斯噪声在深度学习网络中的应用
  • ¥15 关于docker部署flink集成hadoop的yarn,请教个问题 flink启动yarn-session.sh连不上hadoop,这个整了好几天一直不行,求帮忙看一下怎么解决
  • ¥15 深度学习根据CNN网络模型,搭建BP模型并训练MNIST数据集