django JavaScript只在第一次审查时返回值，我不知道为什么

uqzxnwby 于 2023-04-22 发布在 Go

关注(0)|答案(1)|浏览(65)

我遇到了一个问题，但我不知道是什么带来的。
当我尝试循环Django到JavaScript来显示星星时，它只在第一次审查时返回，其余的都没有返回。

现在有什么不能做的，以便每个用户谁添加了一个评级它显示它的明星不显示只有第一个？

下面是我的HTML和JavaScript
即使我也添加了一个图像的结果，如果尝试刷新页面。

Html

{% for review in reviews %}
   <p>display of numbers </p>
   <option value="{{ review.rating }}" id="hours"></option>
<div class="staz">
<p id="demo"></p>
{% endfor %}

JavaScript

<script>
    let hour = document.getElementById('hours').value;
    let greetings;
        if (hour == 1){
            greetings = "★";
        }
        else if (hour == 2){
            greetings = "★★"
        }
        else if(hour == 3){
            greetings = "★★★"
        }
        else if(hour == 4){
            greetings = "★★★★"
        }
        else if(hour == 5){
            greetings = "★★★★★";
        }
        document.getElementById('demo').innerHTML = greetings
</script>

结果

我希望每一个评论，它返回它的星星。

django

来源：https://stackoverflow.com/questions/76056385/javascript-returns-value-on-the-first-review-only-l-dont-know-why

1条答案

按热度按时间

46scxncf1#

你可以将id改为class，然后使用querySelectorAll获取所有具有hours类的元素，并将所需的星星赋值给div。
因此，您的django代码将更改为：

{% for review in reviews %}
 <!--...some codes added class here -->
   <option value="{{ review.rating }}" class="hours"></option>
<div class="staz">
<p class="demo"></p> <!--added class here -->
{% endfor %}

演示代码：

const hours_div = document.querySelectorAll('.hours');
hours_div.forEach(function(item) {
  var hour = item.value;
  var greetings = ''
  if (hour == 1) {
    greetings = "★";
  } else if (hour == 2) {
    greetings = "★★"
  } else if (hour == 3) {
    greetings = "★★★"
  } else if (hour == 4) {
    greetings = "★★★★"
  } else if (hour == 5) {
    greetings = "★★★★★";
  }
  item.nextElementSibling.children[0].innerHTML = greetings
})

<p>display of numbers </p>
<option value="4" class="hours"></option>
<div class="staz">
  <p class="demo"></p>
</div>

<p>display of numbers </p>
<option value="3" class="hours"></option>
<div class="staz">
  <p class="demo"></p>
</div>

<p>display of numbers </p>
<option value="2" class="hours"></option>
<div class="staz">
  <p class="demo"></p>
</div>

<p>display of numbers </p>
<option value="1" class="hours"></option>
<div class="staz">
  <p class="demo"></p>
</div>

赞(0）回复(0）举报 2023-04-22

我来回答

django JavaScript只在第一次审查时返回值，我不知道为什么

1条答案

相关问题

热门标签

最新问答