使用Javascript中的each（）无法获得正确的结果

时间：2015-11-13 20:41:24

标签： javascript jquery

我使用每个函数来获取输入框的值并选择框来进行一些计算但似乎计算在模块1部分工作正常只有其余模块没有任何事情发生由于某种原因我不知道是什么到现在为止： -

这是一个正在发生的事情的演示： -

http://jsfiddle.net/r2shhxhj/

这是我的javascript代码

$(document).ready(function(){
  $("#Scal").click(function() {
	  var sumSc = 0;
	  var sumSg = 0;
	  var sumSgSc = 0;	
        $('[name^="Sc"], [name^="Sgrade"]').each(function () {
			sumSc += +$(this).val();
            sumSg = $(this).val() * $('[name^="Sgrade"]').val();
			sumSgSc += +sumSg
         	});
			var total = sumSgSc/sumSc
			console.log(total);
		    $('#Sres').val(total);
  });
  });

1 个答案:

答案 0 :(得分：3)

当内部逻辑期望this为信用卡号时，您会同时找到信用和成绩。

找到一个学分，你想找到下一个年级;相反，你提取所有成绩，并从中获取val()，这将始终返回第一场比赛的值。

相反，搜索只是信用。然后，找到父li的下一个兄弟，并在 中搜索成绩。

＆＃13;
＆＃13; 
$(document).ready(function() {
  $("#Scal").click(function() {
    var sumSc = 0;
    var sumSg = 0;
    var sumSgSc = 0;
    $('input[name^="Sc"]').each(function() {
      var grade = $(this).closest('li').next('li').find('[name^=Sgrade]');
      sumSc += +$(this).val();
      sumSg = $(this).val() * grade.val();
      sumSgSc += +sumSg
    });
    var total = sumSgSc / sumSc
    $('#Sres').val(total);
  });
});
＆＃13; 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div data-role="page">
  <div data-role="header" data-theme="f"> <a data-iconpos="notext" data-transition="pop" data-direction="reverse" data-role="button" data-icon="home" title="Home" href="index.html">Home</a>

    <h1>BENG & BSc</h1>

  </div>
  <form id="form">
    <div id="GPA1" class="GPA1">
      <div class="BENG" id="N1">
        <ul data-role="listview" data-inset="true">
          <li style="border:none">
            <h1>Module 1:</h1>

          </li>
          <li data-role="fieldcontain" style="border:none">
            <label for="Sc1">Credits:</label>
            <input type="number" step="0.01" name="Sc1" id="Sc1" class="Sc" value="" data-clear-btn="true">
          </li>
          <li data-role="fieldcontain" style="border:none">
            <label for="Sgrade1" class="select">Grade:</label>
            <select name="Sgrade1" class="Sgrade" data-theme="f" id="Sgrade1">
              <option value="-1">—</option>
              <option value="4">A</option>
              <option value="3.7">A-</option>
              <option value="3.3">B+</option>
              <option value="3">B</option>
              <option value="2.7">B-</option>
              <option value="2.3">C+</option>
              <option value="2">C</option>
              <option value="1.7">C-</option>
              <option value="1.3">D+</option>
              <option value="1">D</option>
              <option value="0">F</option>
            </select>
          </li>
        </ul>
      </div>
      <div class="BENG" id="N2">
        <ul data-role="listview" data-inset="true">
          <li style="border:none">
            <h1>Module 2:</h1>

          </li>
          <li data-role="fieldcontain" style="border:none">
            <label for="Sc2">Credits:</label>
            <input type="number" step="0.01" name="Sc2" id="Sc2" class="Sc" value="" data-clear-btn="true">
          </li>
          <li data-role="fieldcontain" style="border:none">
            <label for="Sgrade2" class="select">Grade:</label>
            <select name="Sgrade2" class="Sgrade" data-theme="f" id="Sgrade2">
              <option value="-1">—</option>
              <option value="4">A</option>
              <option value="3.7">A-</option>
              <option value="3.3">B+</option>
              <option value="3">B</option>
              <option value="2.7">B-</option>
              <option value="2.3">C+</option>
              <option value="2">C</option>
              <option value="1.7">C-</option>
              <option value="1.3">D+</option>
              <option value="1">D</option>
              <option value="0">F</option>
            </select>
          </li>
        </ul>
      </div>
      <div class="BENG" id="N3">
        <ul data-role="listview" data-inset="true">
          <li style="border:none">
            <h1>Module 3:</h1>

          </li>
          <li data-role="fieldcontain" style="border:none">
            <label for="Sc3">Credits:</label>
            <input type="number" step="0.01" name="Sc3" id="Sc3" class="Sc" value="" data-clear-btn="true">
          </li>
          <li data-role="fieldcontain" style="border:none">
            <label for="Sgrade3" class="select">Grade:</label>
            <select name="Sgrade3" class="Sgrade" data-theme="f" id="Sgrade3">
              <option value="-1">—</option>
              <option value="4">A</option>
              <option value="3.7">A-</option>
              <option value="3.3">B+</option>
              <option value="3">B</option>
              <option value="2.7">B-</option>
              <option value="2.3">C+</option>
              <option value="2">C</option>
              <option value="1.7">C-</option>
              <option value="1.3">D+</option>
              <option value="1">D</option>
              <option value="0">F</option>
            </select>
          </li>
        </ul>
      </div>
      <div class="BENG" id="N4">
        <ul data-role="listview" data-inset="true">
          <li style="border:none">
            <h1>Module 4:</h1>

          </li>
          <li data-role="fieldcontain" style="border:none">
            <label for="Sc4">Credits:</label>
            <input type="number" step="0.01" name="Sc4" id="Sc4" class="Sc" value="" data-clear-btn="true">
          </li>
          <li data-role="fieldcontain" style="border:none">
            <label for="Sgrade4" class="select">Grade:</label>
            <select name="Sgrade4" class="Sgrade" data-theme="f" id="Sgrade4">
              <option value="-1">—</option>
              <option value="4">A</option>
              <option value="3.7">A-</option>
              <option value="3.3">B+</option>
              <option value="3">B</option>
              <option value="2.7">B-</option>
              <option value="2.3">C+</option>
              <option value="2">C</option>
              <option value="1.7">C-</option>
              <option value="1.3">D+</option>
              <option value="1">D</option>
              <option value="0">F</option>
            </select>
          </li>
        </ul>
      </div>
      <div class="BENG" id="N5">
        <ul data-role="listview" data-inset="true">
          <li style="border:none">
            <h1>Module 5:</h1>

          </li>
          <li data-role="fieldcontain" style="border:none">
            <label for="Sc5">Credits:</label>
            <input type="number" step="0.01" name="Sc5" id="Sc5" class="Sc" value="" data-clear-btn="true">
          </li>
          <li data-role="fieldcontain" style="border:none">
            <label for="Sgrade5" class="select">Grade:</label>
            <select name="Sgrade5" class="Sgrade" data-theme="f" id="Sgrade5">
              <option value="-1">—</option>
              <option value="4">A</option>
              <option value="3.7">A-</option>
              <option value="3.3">B+</option>
              <option value="3">B</option>
              <option value="2.7">B-</option>
              <option value="2.3">C+</option>
              <option value="2">C</option>
              <option value="1.7">C-</option>
              <option value="1.3">D+</option>
              <option value="1">D</option>
              <option value="0">F</option>
            </select>
          </li>
        </ul>
      </div>
    </div>
    <ul data-role="listview" data-inset="true" id="buttons">
      <li class="ui-body ui-body-b" style="border:none">
        <fieldset class="ui-grid-a">
          <div>
            <button type="button" id="Sadd" name="Sadd" data-theme="f">Add Module</button>
          </div>
        </fieldset>
      </li>
      <li class="ui-body ui-body-b" style="border:none">
        <fieldset class="ui-grid-a">
          <div>
            <button type="button" id="Sremove" name="Sremove" data-theme="f">Remove Module</button>
          </div>
        </fieldset>
        <li data-role="fieldcontain" style="border:none">
          <label for="Sres">Your GPA:</label>
          <input type="number" step="0.01" name="Sres" id="Sres" value="" data-clear-btn="true" readonly>
        </li>
      </li>
      <li class="ui-body ui-body-b" style="border:none">
        <fieldset class="ui-grid-a">
          <div>
            <button type="button" id="Scal" name="Scal" data-theme="f">Calculate</button>
          </div>
        </fieldset>
      </li>
      <li class="ui-body ui-body-b" style="border:none">
        <fieldset class="ui-grid-a">
          <div>
            <button type="reset" data-theme="d">Reset</button>
          </div>
        </fieldset>
      </li>
    </ul>
  </form>
</div>
＆＃13;
＆＃13;
＆＃13;

相关问题
最新问题