Question

我有下面的单选按钮，我想用简单的复选框替换它们（2个选项，不用多谢） - 留下3个复选框。

我无法改变JS以使其工作......我已经尝试调整JS但它停止了计算或重定向的能力 - 这是主要的形式目的！

帮助！

<html>
<head></head>
<body>
<form onSubmit="submitForm();" id="myForm" type="get">
<input type="radio" name="myRadio1" data-op="0" value="10" onClick="calcNow();" selected />Option A&nbsp;
<input type="radio" name="myRadio1" data-op="1" value="120" onClick="calcNow();" />No thanks<br/>
<input type="radio" name="myRadio2" data-op="0" value="10" onClick="calcNow();" selected />Option B&nbsp;
<input type="radio" name="myRadio2" data-op="1" value="20" onClick="calcNow();" />No thanks<br/>
<input id="myCheckbox" name="myCheckbox" type="checkbox" value="10" onClick="calcNow();" />Otion C<br/>
<input id="myTotal" name="myTotal" type="text" value="" disabled="disabled" /><br/>
<input type="button" id="myButton" onClick="submitForm();" value="Continue" />
</form>

<script type="text/javascript">
var pages = [[["http://mysite.com/page1.html","http://mysite.com/page2.html"],["http://mysite.com/page3.html","http://mysite.com/page4.html"]],[["http://mysite.com/page5.html","http://mysite.com/page6.html"],["http://mysite.com/page7.html","http://mysite.com/page8.html"]]];

function calcNow()
{
    var cb = document.getElementById("myCheckbox");
    var cost1 = getRadioValue("myRadio1");
    var cost2 = getRadioValue("myRadio2");
    var cost3 = cb.checked ? parseInt(cb.value) : 0;
    var costTotal = cost1 + cost2 + cost3;
    document.getElementById("myTotal").value = costTotal;

    var op1 = getRadioData("myRadio1", "op");
    var op2 = getRadioData("myRadio2", "op");
    var op3 = cb.checked ? 1 : 0;

    if (op1 != undefined && op2 != undefined && op3 != undefined)
    {
        return pages[op1][op2][op3];
    }
    return undefined;
}

function submitForm()
{
    var page = calcNow();
    if (page != undefined)
    {
        // ---- To popup ----
        //alert(page);
        // ---- To navigate ----
        location.href = page;
        // ---- To alter post ----
        //var form = document.getElementById("myForm");
        //form.action = page;
        //form.submit();
    }
    else
    {

        alert("Please answer all questions.");
    }
}

function getRadioValue(name)
{
  var controls = document.getElementsByName(name);
  for (var i = 0; i < controls.length; i++) {
      if (controls[i].checked) {
          return parseInt(controls[i].value);
      }
  }
  return 0;
}

function getRadioData(name, attribute)
{
  var controls = document.getElementsByName(name);
  for (var i = 0; i < controls.length; i++) {
      if (controls[i].checked) {
          return parseInt(controls[i].dataset[attribute]);
      }
  }
  return undefined;
}
</script>
</body>
</html>

Answer 1

我建议你和我不用你的Javascript。

有两个建议。您可以使用两个输入复选框替换输入电台。

<input type="checkbox" name="myRadio1" data-op="1" value="on" onClick="calcNow();" />No thanks<br/>
<input type="checkbox" name="myRadio2" data-op="0" value="10" onClick="calcNow();" selected />Option B&nbsp;

这很容易，但现在很难。检查输入后，调用函数calcNow()，但如果取消选中，则无法调用该函数。但对于管理层我建议你在GOOGLE上搜索。

对我来说，最好是添加调用函数submitForm();

的按钮

这是example for checked and unchecked。

编辑：

我正在处理您的案例，并且有一个解决方案JSDIFFLE

将单选按钮更改为复选框

1 个答案: