Javascript没有隐藏按钮

时间:2018-07-17 07:49:49

标签: javascript html jinja2

我有一个在FLASK后端运行的html部分,它将产生动态的divs。我有两个按钮backnextback中的div按钮将被禁用。然后,从second divlast div,将显示back按钮。

最后一个div需要禁用next按钮。但是我无法禁用它。见我下面的代码。这里出什么问题了:

     {% set ns = namespace(num=1) %}
{% for i in project %}
{% for j in i %}
     <div id="div{{ ns.num }}" style="display:none;">
        <h4>
          {{ j }}
        </h4>
            <button type="submit" id="nxt" name="project1" class="btn btn-primary m-b-10 m-l-5" style="display:block;float: right" onclick="nextdiv({{ ns.num }});">Next</button>
            <button type="submit" id="bck" name="project" class="btn btn-primary m-b-10 m-l-5" style="display:inline-block;float: right" onclick="backdiv({{ ns.num }});">Back</button>
          </div>
           {% set ns.num = ns.num+1 %}
            {% endfor %}
             {% endfor %}
          </div>

这是我的javascript:

<script type="text/javascript">
document.getElementById('div1').style.display = 'block';
document.getElementById('bck').style.display = 'none';
document.getElementById('nxt').style.display = 'block';
function nextdiv(value) {
  var count = {{ project|count }}
  var count = count-1
  if (value == count) {
  console.log("condition met")
  document.getElementById('div'+(value+1)).style.display = 'block';
  document.getElementById('bck').style.display = 'block';
  document.getElementById('nxt').style.display = 'none';
  document.getElementById('div'+value).style.display = 'none';
}
else{
  console.log("not met")
  document.getElementById('div'+(value+1)).style.display = 'block';
  document.getElementById('bck').style.display = 'block';
  document.getElementById('div'+value).style.display = 'none';
}
}

function backdiv(value) {
   document.getElementById('div'+value).style.display = 'none';
  document.getElementById('div'+(value-1)).style.display = 'block';
 if (value <= 2) {
document.getElementById('bck').style.display = 'none';
 }
}
    </script>

1 个答案:

答案 0 :(得分:0)

尝试使用

document.getElementById('nxt').style.visibility = 'hidden';