php - JavaScript 问题？

Question

现在，当我让用户投票时，脚本会更新我的数据库，但它不会显示下面的代码来告诉用户其投票已被排除，除了我的 AJAX 代码之外，其他一切都正常工作。

如何解决此问题，让以下代码在用户输入投票时显示新的评分？

我正在使用 PHP

这是 JavaScript 代码。

    function vote(id, rating) {
        if (window.XMLHttpRequest) {
            http = new XMLHttpRequest();
        } else if (window.ActiveXObject) {
            http = new ActiveXObject("Microsoft.XMLHTTP");
        }
        var url = 'ajax.php?';
        var fullurl = url + 'id=' + id + '&rating=' + rating;
        //This will create the request to our file, with the information about the vote.
        http.open("GET", fullurl, true);
        http.send(null);
        http.onreadystatechange = statechange_rate;
    }

    function statechange_rate() {
        if (http.readyState == 4) {
            var xmlObj = http.responseXML;
            var html = xmlObj.getElementsByTagName('result').item(0).firstChild.data;
            var id = xmlObj.getElementsByTagName('result').item(0).getAttribute("id");
            var votes = xmlObj.getElementsByTagName('result').item(0).getAttribute("votes");
            var rating = xmlObj.getElementsByTagName('result').item(0).getAttribute("rating");
            //Before, you may have noticed we set votes="-1" if they had already voted, this was just to provide an easy way to check the return of our ajax.php script.
            if(votes != -1) {
                //This will inform the user about the vote they have cast.
                document.getElementsByName('output_' + id).item(0).innerHTML = "<br />" + html;
                //This will set a delay to make that message go away in 5000 miliseconds (5 seconds).
                window.setTimeout("document.getElementsByName('output_" + id + "').item(0).innerHTML = '';", 5000);
                //This will update the rating on the page to the new one.
                document.getElementsByName('rating_' + id).item(0).innerHTML = rating;
                document.getElementsByName('votes_' + id).item(0).innerHTML = votes;
            }else{
                document.getElementsByName('output_' + id).item(0).innerHTML = "<br />" + html;
                window.setTimeout("document.getElementsByName('output_" + id + "').item(0).innerHTML = '';", 5000);
            }
        }
    }

Answer 1

我从未见过您所显示的内容，所以我不知道这是否是您的问题，但您有一个名为 <result>...</result> 的标签？

你有这句话，这引出了我的问题:

xmlObj.getElementsByTagName('result')...

如果您可以修改您的statechange_rate，将会很有帮助。因此:

alert("votes result: " + votes);
if(votes != -1) {
  //This will inform the user about the vote they have cast.
  var elem = document.getElementsByName('output_' + id);
  elem.item(0).innerHTML = "<br />" + html;
  //This will set a delay to make that message go away in 5000 miliseconds (5 seconds).
  window.setTimeout("document.getElementsByName('output_" + id + "').item(0).innerHTML = '';", 5000);
  //This will update the rating on the page to the new one.
  elem = document.getElementsByName('rating_' + id);
  elem.item(0).innerHTML = rating;
  elem = document.getElementsByName('votes_' + id);
  elem.item(0).innerHTML = votes;

如果您使用 IE8，则打开 javascript 调试器(我按 F12 来获取它)，如果使用 Firefox，则使用 Firebug 插件，这是我的首选方法。

在每个elem = ...之后设置断点并确保您获得了所需的项目。

我预计第一个 alert但这可能是问题所在，因为 ajax 调用的结果可能会被缓存。您需要确保您的浏览器不会缓存响应，但是，我发现最好将响应中的 header 设置为 no-cache ，而且还要在我的请求中传递当前秒+毫秒，尽管我从不检查该值，但是，通过将其放在那里，它不太可能会重复，因此不会从浏览器缓存中提取。

如果您正在使用 getElementsByTagName是不正确的，因为您没有检查是否返回任何元素，因此当您尝试获取第一个元素时可能会收到错误。当列表中至少应该有一个时，您应该进行健全性检查，并确保列表不为空。如果您抛出异常，Firebug 将在控制台上显示错误，这可以解释为什么您的更新未显示。

如果你不想使用jQuery，如果你可以设置元素的id，那么最好使用document.getElementById .