没有表单的document.myform.checkbox.checked

时间:2011-02-23 20:20:12

标签: javascript forms getelementbyid

我知道我在问题上面提到的(上面)是不可能的,但我有一个问题,我有双重肚子等等,页面内的表格,我需要提交一个表格,以获取所有以前表格中的数据。

警告:我从3或4天前开始使用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){做某事}与此相互作用:

    <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文件。

2 个答案:

答案 0 :(得分:0)

使用Jquery。易于使用这样的东西。这是一个jsfiddle,它有效。

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

答案 1 :(得分:0)

使用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将简单地处理它而无需对代码进行任何更改。