javascript - javascript if 语句做-while

Question

我试图让这段代码在while循环而不是if中工作。如果 printLoad_# val 为空，我需要不显示 num_# 的每一时刻。因此，如果 printLoad_1 value = nothing，则不会显示 Num_1，然后 printLoad_2 会检查其 num_2 是否为空，依此类推。我遇到的问题是功能在检查每个部分之前停止。我不确定一段时间是否有效。

$(document).ready(function() {
    if(document.getElementById("printLoad_1").value == "")
    {
        document.getElementById('num_1').style.display = 'none';
    }
    if(document.getElementById("printLoad_2").value == "")
    {
        document.getElementById('num_2').style.display = 'none';
    }
    if(document.getElementById("printLoad_3").value == "")
    {
        document.getElementById('num_3').style.display = 'none';
    }
    if(document.getElementById("printLoad_4").value == "")
    {
        document.getElementById('num_4').style.display = 'none';
    }
    if(document.getElementById("printLoad_5").value == "")
    {
        document.getElementById('num_5').style.display = 'none';
    }
});

score 4 · Accepted Answer

您是否考虑过仅合成字符串而不是这种冗长的构造？像这样的东西：

for( var i=1; i<=5; i++ ) {
  if( document.getElementById('printLoad_'+i).value === '' ) {
      document.getElementById('num_'+i).style.display = 'none';
  }
}

score 2 · Accepted Answer

假设您正在使用 jQuery 并且您的元素是有序的，我会忘记 ID。如果您使用通用类，例如.printloadand .num，那么您可以轻松地按索引定位元素，例如：

$('.printload').each(function(i){
  if (!this.value) $('.num').eq(i).hide();
});

score 1 · Accepted Answer

如果您有可变数量的 printLoad 和 num：

var i = 1,
pl=document.getElementById('printLoad_'+i),
num = document.getElementById('num_'+i);
while(pl !== null && num !== null){
  if(pl.value === ""){
    num.style.display = 'none';
  }
  i++;
  pl=document.getElementById('printLoad_'+i),
  num = document.getElementById('num_'+i);
}

score 1 · Accepted Answer

这是对“动态工作”的 Ethan 答案的轻微修改。我还更新了它以使用 jQuery。如果使用CSS 类和层次关系，这可以更清晰地处理，但这会影响 DOM 的生成方式。

for (var i = 1; /* break */; i++) {
    var printEl = $('#printLoad_' + i)
    if (printEl.length) {
        if (!printEl.val()) {
            $('#num_' + i).css({display: 'none'})
        }
    } else {
        // No #printLoad_N, guess we're done looking
        break
    }
}

score 0 · Accepted Answer

根据@elclanr 的回答：

使用通用类，并通过索引定位元素，它会简单得多。

将“printLoad”元素设置为class='printLoad'，将“num”元素设置为class='num'. 然后...

for (i=0;i<document.getElementByClass('printLoad').length;i++)
{
    if (document.getElementByClass('printLoad')[i].value == "")
    {
        document.getElementByClass('num')[i].style.display='none';
    }
}

javascript - javascript if 语句做-while

5 回答 5

Related

Reference