Img-src只通过javascript更改一次

Img src only changing once through javascript

本文关键字:一次 javascript Img-src      更新时间:2023-09-26

好吧,我在博客上建立了一个投票系统。很像这里的斯塔克弗流。该系统在博客的第一篇帖子上运行良好,但每隔一篇帖子,点击图片时都不会发生变化,但实际的投票过程仍在进行中。

为什么?任何帮助都会很棒!

这是我的JS:

function upvote(id)
  {
    sender = new XMLHttpRequest();
    if(document.getElementById("upvoteimg").src.indexOf("voted") == -1)  //have they already voted up?
    {
      document.getElementById("upvoteimg").src = "assets/upvoted.png"; // change to upvoted
      sender.open("GET","/like/index/" + id ,true);
      sender.send();
      document.getElementById("likes").innerHTML = parseInt(document.getElementById("likes").innerHTML) +1; //update #
    }
  else
    {
      document.getElementById("upvoteimg").src = "assets/upvote.png"; //change to not upvoted
      sender.open("GET","/like/index/" + id ,true);
      sender.send()
      document.getElementById("likes").innerHTML = parseInt(document.getElementById("likes").innerHTML) - 1; //update #
    }
  }
  function downvote(id)
  {
    sender = new XMLHttpRequest();
    if(document.getElementById("downvoteimg").src.indexOf("voted") == -1) //have they already downvoted?
    {
      document.getElementById("downvoteimg").src = "assets/downvoted.png"; //change to downvoted
      sender.open("GET","/like/down/" + id ,true);
      sender.send()
      document.getElementById("likes").innerHTML = parseInt(document.getElementById("likes").innerHTML) - 1; //update #
    }
  else
    {
      document.getElementById("downvoteimg").src = "assets/downvote.png"; //change to not downvoted
      sender.open("GET","/like/down/" + id ,true);
      sender.send()
      document.getElementById("likes").innerHTML = parseInt(document.getElementById("likes").innerHTML) +1; //update #
    }
  }

在我看来,以下是按钮:

<!-- Voting System -->
<div id="post-vote">
    <% #DownVote %>
        <%if user_signed_in?%>  
            <%if Dislikes.where(:user_id => current_user.id, :article_id =>a.id).size == 0%>
                <%= image_tag("downvote.png", "onclick" => "downvote(#{a.id})", "id" => "downvoteimg") %>
            <%else%>
                <%= image_tag("downvoted.png", "onclick" => "downvote(#{a.id})", "id" => "downvoteimg") %>
            <%end%>
        <%else%>
            <%= image_tag("downvote.png", "onclick" => "alert('You must login to vote.')", "id" => "downvoteimg") %>
        <%end%>
    <% #TheNumber %>
    <span id="likes" class="vote-count"><%= a.likes.size - Dislikes.where(:article_id =>a.id).size%></span>
    <% #UpVote %>
        <%if user_signed_in?%>  
            <%if !a.likes.include?(current_user)%>
                <%= image_tag("upvote.png",  "id" => "upvoteimg", "onclick" => "upvote(#{a.id})") %>
            <%else%>
                <%= image_tag("upvoted.png",  "id" => "upvoteimg", "onclick" => "upvote(#{a.id})") %>
            <%end%>
        <%else%>
            <%= image_tag("upvote.png", "id" => "upvoteimg", "onclick" => "alert('You must login to vote.')") %>
        <%end%>
</div>

将js中的所有图像都更改为具有唯一id document.getElementById("upvoteimg")document.getElementById("upvoteimg" + id)

并且视图中的所有图像到<%= image_tag("downvoted.png", "onclick" => "downvote(#{a.id})", "id" => "downvoteimg#{a.id}") %>