0

我经常使用这个网站进行研究等，发现它非常有用。

我一直在开发一些代码，它将获取输入 id 名称的列表，然后使用 javascript/jquery 将这些值添加在一起。

这就是我到目前为止所拥有的 - 因为我还是个新手，所以它可能很离谱。

到目前为止，代码可以很好地获取输入的名称。它的计算也很好，但是当我将数组放入“var fieldnames”时，计算停止工作了吗？

当我将数组复制出来（将其放入输入之后）并将其粘贴到“var fieldnames”中时，它可以正常工作。

问题似乎是数组没有正确传递给“var fieldnames”？

这是页面中的代码-它将数组放入底部的输入中仅用于调查目的，但除非您手动输入输入名称，否则计算不起作用！

任何帮助将非常感激。谢谢

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
</head><body>




<script type="text/javascript" language="javascript">
function getTotal(oForm)
  {
var arrayOfIDs = $('.myClass').map(function() { return this.id; }).get();
var test = (arrayOfIDs.length ? "'" + arrayOfIDs.join("','") + "'" : "");

 document.getElementById("sum").value = test;

  var field, i = 0, total = 0, els = oForm.elements;
  var fieldnames = [test];

  document.getElementById("sum1").value = fieldnames;

  for (i; i < fieldnames.length; ++i)
  {
  field = els[fieldnames[i]];
  if (field.value != '' && isNaN(field.value))
  {
  alert('Please enter a valid number here.')
  field.focus();
  field.select();
  return '';
  }
  else total += Number(field.value);
  }
  return ' ' + total;
  }
</script>




<div id="listing">
<form>
<table>
<td>8065020</td>
<td>2012-04-10</td>
<td>household</td>
<td><input    class="myClass" id="pay47" type="text" name="pay47" value="38.45"/></td>
</tr>
<tr>
<td>8065021</td>
<td>2012-04-10</td>

<td>household</td>
<td><input   class="myClass" id="pay48" type="text" name="pay48" value="37.4"/></td>
</tr>
<tr>
<td>8065022</td>
<td>2012-04-10</td>
<td>household</td>
<td><input   class="myClass"  id="pay49" type="text" name="pay49" value="375"/></td>
</tr>
<tr>
<td>8065014</td>
<td>2012-04-04</td>

<td>household</td>
<td><input type="text"  class="myClass"  id="pay50" name="pay50" value="06"/></td>
</tr>
<tr>
<td>8065015</td>
<td>2012-04-04</td>
<td>motorprotect</td>
<td><input type="text"  class="myClass"  id="pay51" name="pay51" value="01"/></td>
</tr>
<tr>
<td>8065011</td>
<td>2012-03-06</td>

<td>household</td>
<td><input type="text"   class="myClass" id="pay52" name="pay52" value="55"/></td>
</tr>
<tr>
<td>8065012</td>
<td>2012-03-06</td>
<td>household</td>
<td><input type="text"  class="myClass"  id="pay53" name="pay53" value="56"/></td>
</tr>
<tr>
<td>1</td>
<td/>

<td>household</td>
<td><input type="text"   class="myClass" id="pay54" name="pay54" value="56"/></td>
</tr>
<tr>
<td>2</td>
<td/>
<td>household</td>
<td><input type="text"  class="myClass"  id="pay55" name="pay55" value="52"/></td>
</tr>
<tr>
<td>3</td>
<td/>
<td>household</td>

<td><input type="text"  class="myClass"  id="pay56" name="pay56" value="53"/></td>
</tr>
<tr>
<td>4</td>
<td/>
<td>household</td>
<td><input type="text"  class="myClass"  id="pay57" name="pay57" value="55"/></td>
</tr>
<tr>
<td>8065001</td>
<td/>
<td>landlord</td>
<td><input type="text"  class="myClass"  id="pay58" name="pay58" value="5"/></td>

</tr>
<tr>
<td>8065002</td>
<td/>
<td>landlord-basic</td>
<td><input type="text"   class="myClass" id="pay59" name="pay59" value="59"/></td>
</tr>
<tr>
<td>8065003</td>
<td/>
<td>household</td>
<td><input type="text"  class="myClass"  id="pay60" name="pay60" value="5"/></td>
</tr>

<tr>
<td>8065004</td>
<td/>
<td>household</td>
<td><input type="text"  class="myClass"  id="pay61" name="pay61" value="5"/></td>
</tr>
<tr>
<td>8065005</td>
<td/>
<td>household</td>
<td><input type="text"   class="myClass" id="pay62" name="pay62" value="5"/></td>
</tr>
<tr>

<td>8065006</td>
<td/>
<td>landlord-basic</td>
<td><input type="text"   class="myClass"  id="pay63" name="pay63" value="64"/></td>
</tr>
<tr>
<td>8065008</td>
<td/>
<td>household</td>
<td><input type="text"   class="myClass" id="pay64" name="pay64" value="5" /></td>
</tr>
<tr>
<td>8065010</td>

<td/>
<td>business-basic</td>
<td><input type="text"  class="myClass"  id="pay65" name="pay65" value="10" /></td>
</tr>
</table>


<input id="total" type="text" name="total" value="" readonly="readonly" /> 
<input type="button" value="Get Total" onclick="total.value=getTotal(this.form)" />
<br /><br />
<input name="totalpay" id="sum" type="text" />sum<br />
<input name="totalpay" id="sum1" type="text" />sum1
</form>
</div>






</body>
</html>
4

2 回答 2

0

1-更换线路

var test = (arrayOfIDs.length ? "'" + arrayOfIDs.join("','") + "'" : "");

经过

var test = (arrayOfIDs.length ? arrayOfIDs.join(",") : "");

2-更换

var fieldnames = [test];

经过

var fieldnames = test.split(",");

3-更换

field = els[fieldnames[i]];

经过

field = document.getElementById(fieldnames[i]);

我在这里所做的只是纠正你的代码来解决你的问题，但我确信你可以用更简单的方式做到这一点。

于 2012-07-17T12:43:06.800 回答
0

如果我正确理解了您的问题，并且您只想将您的值相加，同时提供基本的有效性检查，那么您的代码就会变得复杂。像 jQuery 这样的框架为您提供了更简单的方法。

而不是遍历所有输入元素，获取它们的 id 然后再次遍历它们，只需执行一次。

var getTotal (oForm) {
    var sum = 0;
    // loop through all inputs with class "myClass" inside oForm
    $("input.myClass", $(oForm)).each(function (index, value) {
        // add up all values that are non empty and numeric
        if (value !== "" && !isNaN(value)) {
            // parse the value
            sum += parseFloat(value, 10);
        } else {
            // show an alert, focus the input and return early from $.fn.each
            alert("Please enter a valid number here!");
            $(this).focus();
            return false;
        }
    });

    // set the value of 
    $("sum").val(sum);
}

这是从我的头顶写的，但应该可以正常工作。

于 2012-07-17T12:17:02.020 回答