Question

我必须承认，我对JavaScript知之甚少，这就是为什么我的问题可能听起来有些愚蠢。

但我要做的是从名称无线电组中选择值。

看起来像这样

function calc() {
    var op1 = document.getElementsByName('form[radio1]');
    var op2 = document.getElementsByName('form[radio2]');
    var op3 = document.getElementsByName('form[radio3]');

    var result = document.getElementById('result');

    result.value = 0;

    result.value = parseInt(result.value);

    for (i = 0; i < op1.length; i++) {
        if (op1[i].checked) result.value = parseInt(result.value) + parseInt(op1[i].value);
    }

    for (i = 0; i < op2.length; i++) {
        if (op2.options[i].selected) result.value = parseInt(result.value) + parseInt(op2[i].value);
    }

    for (i = 0; i < op3.length; i++) {
        if (op3.options[i].selected) result.value = parseInt(result.value) + parseInt(op3[i].value);
    }

    return false;
}

这是我的表格。我使用rs形式为joomla。

<form action="index.php" enctype="multipart/form-data" id="userForm" method="post">

    <input name="form[radio1]" value="25" id="radio20" type="radio">
        <label for="radio20">Description1</label>

    <input name="form[radio1]" value="35" id="radio21" type="radio">
        <label for="radio21">Description2</label>



    <input name="form[radio2]" value="20" id="radio20" type="radio">
    <label for="radio20">Description1</label>

    <input name="form[radio2]" value="30" id="radio21" type="radio">
    <label for="radio21">Description2</label>


    <input type="hidden" value="0" id="result" name="form[result]">

    <input type="submit" class="rsform-submit-button" onclick="calc()" id="submit" name="form[submit]" value="submit">

一切都会好的，因为功能正常。唯一的麻烦是我有大约80个射线照片。

有没有办法缩短它？

Answer 1

使用对象数组（例如所有单选按钮）并迭代它们。从这样开始：

var opts = [],
    numOpts = 80;

for (var i=0; i<numOpts, i++)
{
    opts.push(document.getElementsByName('form[radio' + i + ']'));
}

编辑：让我们了解完整功能。我唯一不确定的是你是否要使用opX[i].checked或opX.options[i].selected（因为你的代码对op1和op2/3执行了不同的操作）。不过，如果我猜错了，不应该太难推断。

function calc()
{
    var opts = [],
        numOpts = 80,
        value = 0,
        result = document.getElementById('result'),
        i, j, opt;

    for (i=0; i<numOpts; i++)
    {
        opts.push(document.getElementsByName('form[radio' + i + ']'));
    }

    numOpts = opts.length;

    for (i=0; i<numOpts; i++)
    {
        opt = opts[i];
        for (j=0; j<opt.length; j++)
        {
            // or did you mean:
            // if (opt.options[j].selected) ?
            if (opt[j].checked)
            {
                value = value + parseInt(opt[j].value, 10);
            }
        }
    }

    result.value = value;

    return false;
}

Answer 2

jQuery是一个很棒的库，就像在类固醇上使用JavaScript一样。这是非常值得学习的，并且有大量的例子在野外。

你可以像这样编写复杂的“selectors”：

$('input[name=form[radio1]]').attr('checked').each(function() {
      result.value = $(this).attr('value')
})

（我不确定它是否会接受像“form [radio1]”这样的名称有效，但试一试。

缩短JavaScript功能

2 个答案: