Question

我需要一些帮助：我有以下表格：

    <form id="myForm" method="post" action="?action=agc">
<input type="hidden" name="start_date" value="<?= $_POST['start_date'] ?>" /> 
<input type="hidden" name="end_date" value="<?= $_POST['end_date'] ?>" /> 
<input type="hidden" name="c_name" value="<?= $_POST['c_name'] ?>" /> 
<input type="hidden" name="cluster" value='<?= $abn_cluster[0] ?>' />
<input type="hidden" name="abn" value="abn" />

<a href="javascript:addOption();">Add percent</a> <br /><br />
ABN percent<br />
<input type="text" name="poll[option][0][percent]" class="toAdd">&nbsp;<input type="text" name="poll[option][0][name]" value="<?= $_POST['c_name'] ?>_0_">&nbsp;<input type="checkbox" class="optionBox" value="True" name="poll[option][0][control_sample]" /><br />

<script> 
var optionNumber = 1;  
function addOption() { 
    var theForm = document.getElementById("myForm"); 
    var newOption = document.createElement("input"); 
    var newOption2 = document.createElement("input"); 
    var newOption3 = document.createElement("input"); 
    var newLabel = document.createElement("label");
    var newContent = document.createTextNode("  ");
    var newContent2 = document.createTextNode("  ");

    newOption.name = "poll[option]["+optionNumber+"][percent]";
    newOption.type = "text";
    theForm.appendChild(newOption);
    theForm.appendChild(newContent);
    newOption2.name = "poll[option]["+optionNumber+"][name]";
    newOption2.type = "text";
    newOption2.value = "<?= $_POST['c_name'] ?>_"+optionNumber+"_"
    theForm.appendChild(newOption2);
    theForm.appendChild(newContent2);

    newOption3.name = "poll[option]["+optionNumber+"][control_sample]";
    newOption3.type = "checkbox";
    newOption3.className = "optionBox";
    newOption3.value = "True"
    theForm.appendChild(newOption3);

    theForm.appendChild(document.createElement("br")); 
    optionNumber++;
}
</script>
    </p>
</div>
<div class="modal-footer" id="appendform">
    <button type="submit" class="btn btn-primary">Continue</button>
    </form>

现在因为有些输入是根据请求生成的，所以我不知道如何检查（.toAdd）的总和。在提交之前，我基本上需要确保它等于100。什么是我的问题的解决方案？感谢。

Answer 1

尝试

<form id="myForm" method="post" action="iap_crm_campaign.php?action=abngamecampaign" onsubmit="return validate()">

然后

function validate(){
    var sum = 0;

    for(var i = 0; i < optionNumber; i++){
        sum += parseFloat(document.getElementsByName('poll[option][' + i + '][percent]')[0].value);
    }

    if( sum == NaN || sum != 100){
        alert('Sum of percentage must be 100');
        return false;
    }
}

演示：Fiddle

Answer 2

var total = 0;
var toAdds = document.getElementsByClassName("toAdd");
for (var i = 0; i < toAdds.length; i++) {
    total += parseInt(toAdds[i].value, 0);
}
if (total == 100) {
  // OK
} else {
  // not OK
}

此外，添加新选项的代码需要设置类：

newOption.className = "toAdd";

Answer 3

你可以使用jquery

$(".toAdd").length

或简单的js

var myInputs= document.getElementsByTagName('input');
var noOfInputs =myInputs.length;

这将通过循环为您提供i / p元素的计数，用于对值进行求和...

var sum;
$(".toAdd").each(function() {
    sum=sum+$(this).val();
});

提交前检查输入总和

3 个答案: