document.myform.checkbox.checked 没有表单

Question

我知道我在问题（上面）中提到的内容是不可能的，但我这里有一个问题，我有双牛肚等，页面内的表格，我需要提交一个获取里面所有数据的表格以前的表格。

警告：我三四天前开始使用 javascript，我已经习惯了服务器端编程。

让我们看看：

javascript 检查复选框是否被选中（其中几个）：

function KeepCount() {

var NewCount = 0;

if (document.iphone3g.iphone3g1.checked)
{NewCount = NewCount + 1;}

if (document.iphone3g.iphone3g2.checked)
{NewCount = NewCount + 1;}

if (document.iphone3g.iphone3g3.checked)
{NewCount = NewCount + 1;}

if (document.iphone3g.iphone3g4.checked)
{NewCount = NewCount + 1;}

if (document.iphone3gs.iphone3gs1.checked)
{NewCount = NewCount + 1;}

if (document.iphone3gs.iphone3gs2.checked)
{NewCount = NewCount + 1;}

if (document.iphone3gs.iphone3gs3.checked)
{NewCount = NewCount + 1;}

if (document.iphone3gs.iphone3gs4.checked)
{NewCount = NewCount + 1;}

if (document.iphone4.iphone41.checked)
{NewCount = NewCount + 1;}

if (document.iphone4.iphone42.checked)
{NewCount = NewCount + 1;}

if (document.iphone4.iphone43.checked)
{NewCount = NewCount + 1;}

if (document.iphone4.iphone44.checked)
{NewCount = NewCount + 1;}

if (NewCount > 1){
    descontox = 20/100;
    valorx = (total.value * descontox).toFixed(2);
    valor.value  = (total.value - valorx).toFixed(2);
    }

if (NewCount <= 1){
    valor.value = ("");}
}

这告诉我是否应该应用折扣，如果选择了多个复选框，它将应用 20% 的折扣。

如果您注意到，我有几个“if (document.iphone3g.iphone3g1.checked) { do something}”与此交互：

    <div id="one" class="hiddenDiv">

            <div class="image">
                <img class="large" src="images/iphone3g.png" alt="iphone3g" width="141" height="141" />
            </div>
            <form name="iphone3g">
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone3g1" value="50.00"> Vidro Partido<br />
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone3g2" value="59.00"> LCD Danificado<br />
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone3g3" value="80.00"> Substituir capa traseira<br />
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone3g4" value="38.00"> Botão Volume
            </form>
    </div>
            <div id="two" class="hiddenDiv">

            <div class="image">
                <img class="large" src="images/iphone3gs.png" alt="iphone3g" width="141" height="141" />
            </div>
    <form name="iphone3gs">
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone3gs1" value="60"> Vidro Partido 3GS<br />
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone3gs2" value="69"> LCD Danificado 3GS<br />
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone3gs3" value="89"> Substituir capa traseira 3GS<br />
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone3gs4" value="45"> Botão Volume3GS

    </form>
    </div>
            <div id="three" class="hiddenDiv">

            <div class="image">
                <img class="large" src="images/iphone4.png" alt="iphone3g" width="141" height="141" />
            </div>
    <form name="iphone4">
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone41" value="169"> Vidro/LCD Partido<br />
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone42" value="99"> Substituir capa traseira<br />
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone43" value="79"> Botão Volume<br />
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone44" value="76"> Botão Home

    </form>
    </div>

我有超过 3 个，我该怎么做才能解决这个问题？我需要提交这些数据到一个 php 文件。

Answer 1

使用 jQuery，这可以非常简洁地完成。

// select all checked checkboxes with name attribute that starts with 'iphone'
var NewCount = $("input[name^='iphone']:checked").length;

if (NewCount > 1){
    descontox = 20/100;
    valorx = (total.value * descontox).toFixed(2);
    valor.value  = (total.value - valorx).toFixed(2);
    }

if (NewCount <= 1){
    valor.value = ("");}
}

编辑：souza - 根据您的评论，您似乎已经通过使用单个表单元素解决了该问题。但是，您最好使用一种更通用的方法，例如上面的方法或 mrtsherman 发布的方法。按名称检查每个单独的输入元素将导致代码维护噩梦。

每次出现新的 iPhone 版本和/或运营商、平台时，都需要更新您的标记和 JavaScript。更通用的方法将允许您使用相同的命名约定简单地向标记添加一个新的复选框，并且您的 javascript 将简单地处理它，而不需要对代码进行任何更改。

Answer 2

使用 Jquery。对于这样的事情很容易使用。这是一个可以正常工作的 jsfiddle 。

$(document).ready(function() {
   $("input:checkbox").click(function() {
      var checked = $("input:checked").length;
      alert(checked);
   });
});