Javascript 验证2个表单数组输入，使其总和等于100%

我有一个页面，我正在构建一个用于编辑的值表，然后还合并新行，我已经将其封装到一个表单中

现有表行（

percent\u owners[]

）和新行（

new\u percentage\u owners[]

）相加应等于100，否则验证应失败，用户应修改表单

现有行的代码为：

foreach ($sth->fetchAll(PDO::FETCH_ASSOC) as $row) {
    $id2 = $row['id'];
    $owner_name = $row['owner_name'];
    $owner_id = $row['owner_id'];
    $percent_owned = $row['percent_owned'];

    echo '<tr>';
        echo '<td style="text-align:center"><small><input style="border:none; text-align:center" name="id2[]" type="text"  placeholder="id2" value="';
        echo $id2;
        echo '" readonly></small></td>';

        echo '<td style="text-align:center"><small><input style="border:none; text-align:center" name="owner_id[]" type="text"  placeholder="owner_id" value="';
        echo $owner_id;
        echo '" readonly></small></td>';

        echo '<td style="text-align:center"><small><input style="border:none; text-align:center" name="owner_name[]" type="text"  placeholder="owner_name" value="';
        echo $owner_name;
        echo '" readonly></small></td>';

        echo '<td style="text-align:center"><small>';
        ?>
        <input name="percent_owned[]" id="percent_owned" type="number" class="numeric" style="text-align:center" placeholder="percent_owned" value="<?php echo $percent_owned; ?>">
        <?php 
        echo '</small></td>';
    echo '</tr>';
    }
Database::disconnect();

所以我的问题是-我如何获取两个

输入并合计数组，看看它们的总和是否为100

提前感谢您的任何意见/建议

PS我也知道我在这里混合了PDO和MySQLi，这是固定的：0）

---

答复-工作代码：

<script>
    function validate_ownership_form() {
        var count = 0;
        var val1 = document.forms["ownership_update_form"]["percent_owned[]"];
        for ( var i = 0; i < val1.length; i++ ){
            count = count + Number(val1[i].value);
        }
        if ( count != 100 ) {
            alert("Please ensure 100%, currently percentage is: " +count+"%");
            event.preventDefault();
        } 
    } 
</script>

函数验证\u所有权\u表单（）{
var计数=0；
var val1=document.forms[“所有权更新表格”][“拥有百分比[]”；
对于（变量i=0；i

函数内部的

返回false

不会引起外部任何人的注意。通过HTML属性添加这种老式的事件处理，您需要将返回值传递到下一个“级别”

onsubmit=“return validate\u ownership\u form（）”

。只有这样，表单提交才会真正被阻止（如果您的函数确实返回false）。@04FS Thankyou-这会出现警报，但是当我将count变量添加到警报中时，如

警报（“请确保100%，当前百分比为：“+count”）

，count显示为NaN，这意味着函数计算数组和的方式肯定有错误。感谢您的指点！您正试图添加到一个变量，从外观上看，该变量在该点上甚至没有正确初始化-因此添加该变量。@04FS谢谢您的指针-我还删除了

return false我的代码（现在正在运行！）看起来是这样的：
函数validate_ownership_form（）{var count=0；var val1=document.forms[“ownership_update_form”][“percent_owned[]”；for（var i=0；i
Nah，对于这种旧式事件处理类型，您应该保留使用
return false
的版本-在这里，您将依赖全局事件对象，这是不推荐的，（根据兼容性表，这甚至不应该在Firefox中工作，除非它是以特定的标志启动的…）
<script>
function validate_ownership_form() {
    var val1 = document.forms["ownership_update_form"]["percent_owned[]"].value;
    for ( var i = 0; i < document.forms["ownership_update_form"]["percent_owned[]"].length; i++ ){
        count = count + val1[i];
        if ( count != 100 ) {
            alert("Please ensure 100%");
            return false;
        }
    }
}
</script>

<script>
    function validate_ownership_form() {
        var count = 0;
        var val1 = document.forms["ownership_update_form"]["percent_owned[]"];
        for ( var i = 0; i < val1.length; i++ ){
            count = count + Number(val1[i].value);
        }
        if ( count != 100 ) {
            alert("Please ensure 100%, currently percentage is: " +count+"%");
            event.preventDefault();
        } 
    } 
</script>