for循環聲明語句中的算術運算

Question

為什么這樣工作？

index++;
for (var z=index ; z < 11; z++) {
    $( "#div"+z ).hide();
}

這不是嗎？

for (var z=index+1 ; z < 11; z++) {
    $( "#div"+z ).hide();
}

我真的真的不明白為什么。。。我還將為您提供正在處理的網頁的完整代碼。 我想做的是使下拉選擇器選擇頁面上顯示多少個文本框。 如果我做錯了方法，請告訴我。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Settings</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<style type="text/css">
.hidden {
    display: none;
}
</style>
</head>

<body>
<p align="center">IP address
  <label for="textfield3">:</label>
  <input type="text" name="textfield3" id="textfield3" />
  <label for="textfield4">Port:</label>
  <input type="text" name="textfield4" id="textfield4" />
</p>
<p align="center">
  <label for="select">Number of variables:</label>
  <select name="select" id="select">
    <option value="-" selected="selected">-</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
    <option value="10">10</option>
  </select>
</p>
<div class="hidden" id="div1">
  <p align="center">
    <label for="textfield">Variable1:</label>
    <input type="text" name="textfield" id="textfield" />
    <label for="textfield2">    Display name:</label>
    <input type="text" name="textfield2" id="textfield2" />
  </p>
</div>
<div class="hidden" id="div2">
  <p align="center">
    <label for="textfield21">Variable2:</label>
    <input type="text" name="textfield3" id="textfield21" />
    <label for="textfield22">Display name:</label>
    <input type="text" name="textfield3" id="textfield22" />
  </p>
</div>
<div class="hidden" id="div3">
  <p align="center">
    <label for="textfield23">Variable3:</label>
    <input type="text" name="textfield4" id="textfield23" />
    <label for="textfield24">Display name:</label>
    <input type="text" name="textfield4" id="textfield24" />
  </p>
</div>
<div class="hidden" id="div4">
  <p align="center">
    <label for="textfield25">Variable4:</label>
    <input type="text" name="textfield4" id="textfield25" />
    <label for="textfield26">Display name:</label>
    <input type="text" name="textfield4" id="textfield26" />
  </p>
</div>
<div class="hidden" id="div5">
  <p align="center">
    <label for="textfield27">Variable5:</label>
    <input type="text" name="textfield5" id="textfield27" />
    <label for="textfield28">Display name:</label>
    <input type="text" name="textfield5" id="textfield28" />
  </p>
</div>
<div class="hidden" id="div6">
  <p align="center">
    <label for="textfield29">Variable6:</label>
    <input type="text" name="textfield5" id="textfield29" />
    <label for="textfield30">Display name:</label>
    <input type="text" name="textfield5" id="textfield30" />
  </p>
</div>
<div class="hidden" id="div7">
  <p align="center">
    <label for="textfield31">Variable7:</label>
    <input type="text" name="textfield6" id="textfield31" />
    <label for="textfield32">Display name:</label>
    <input type="text" name="textfield6" id="textfield32" />
  </p>
</div>
<div class="hidden" id="div8">
  <p align="center">
    <label for="textfield33">Variable8:</label>
    <input type="text" name="textfield6" id="textfield33" />
    <label for="textfield34">Display name:</label>
    <input type="text" name="textfield6" id="textfield34" />
  </p>
</div>
<div class="hidden" id="div9">
  <p align="center">
    <label for="textfield35">Variable9:</label>
    <input type="text" name="textfield7" id="textfield35" />
    <label for="textfield36">Display name:</label>
    <input type="text" name="textfield7" id="textfield36" />
  </p>
</div>
<div class="hidden" id="div10">
  <p align="center">
    <label for="textfield37">Variable10:</label>
    <input type="text" name="textfield7" id="textfield37" />
    <label for="textfield38">Display name:</label>
    <input type="text" name="textfield7" id="textfield38" />
  </p>
</div>
<script>
$("select").change(function () {
    var index=0;
    index=$( "select" ).val();
    for (var i=index; i > 0; i--) {
        $( "#div"+i ).show();
    }
    index++;
    for (var z=index ; z < 11; z++) {
        $( "#div"+z ).hide();
    }
  })
</script>

</body>
</html>

Answer 1

您獲得不同行為的原因是因為您從中獲得的價值

index=$( "select" ).val();

是一個字符串。 增量（++）和減量（-）運算符將其轉換為數字，以便循環工作。 但是當你寫

index+1

您將1與索引字符串（例如，“ 5” +1）連接，則得到字符串“ 51”。

嘗試在像Firebug這樣的調試器中單步執行代碼，然后您會看到發生了什么。

for循環聲明語句中的算術運算

問題描述

1 個解決方案

解決方案1
2 已采納 2015-06-27 23:22:43

for循環聲明語句中的算術運算

問題描述

1 個解決方案

解決方案1 2 已采納 2015-06-27 23:22:43

解決方案1
2 已采納 2015-06-27 23:22:43