javascript - 调用 JavaScript 函数 onClick 时，ASP 单选按钮不会被选择

Question

我的 JavaScript 工作正常，但我的单选按钮在单击时不会显示为选中状态。当我使用 alt+tab 离开网页并返回时，它会在单选按钮周围显示一个阴影圆圈，但仍然没有正确的检查填充。这是为什么？

我希望这是一个简单的修复。我更新了我的 asp 单选按钮以调用 JavaScript 函数，因为我的 ASP 代码隐藏正在发出回发并清除页面上的一些控件。不用说，通过 asp c# 代码隐藏功能，单选按钮在单击时可以正确检查。我只需要在 JavaScript 功能到位的情况下单击单选按钮时查看对单选按钮的检查。这是我的 radio 控件 HTML:

<div class="col s12 form-section" id="crimeInsurance">
            <h4 class="section-heading">CRIME INSURANCE</h4>
            <p>
                <asp:RadioButton ID="radLLCrimeIns" runat="server" GroupName="CrimeInsurance" ClientIDMode="Static" CssClass="with-gap" OnClick="return CrimeInsuranceToggle();" AutoPostBack="true" text="ACCEPT Crime Insurance (fee of $250.00)" />
            </p>
            <p>
                <asp:RadioButton ID="radLLNOCrimeIns" runat="server" GroupName="CrimeInsurance" ClientIDMode="Static" CssClass="with-gap" OnClick="return CrimeInsuranceToggle();" AutoPostBack="true" text="DO NOT ACCEPT Crime Insurance" />
            </p>
        </div>

这是我的 JavaScript 方法:

function CrimeInsuranceToggle() {
        //controls the crime insurance radio yes/no buttons to update crime insurance fees
        var oCrimeRte = document.getElementById("lblCrimeCovFlatRate");
        var oCrimeTtl = document.getElementById("lblCrimeCovAmtDue");
        var oCrimeY = document.getElementById("radLLCrimeIns");
        var oCrimeN = document.getElementById("radLLNoCrimeIns");

        var radios = document.getElementsByTagName('input');
        var value;
        for (var i = 0; i < radios.length; i++) {
            if (radios[i].type === 'radio' && radios[i].checked) {
                //find each radio that is checked, and act on the ID
                value = radios[i].value;
                if (value == 'radLLCrimeIns') {
                    oCrimeTtl.innerHTML = oCrimeRte.innerHTML;
                    radios[i].checked = true;
                }
                else if (value == 'radLLNOCrimeIns') {
                    oCrimeTtl.innerHTML = "0.00";
                    radios[i].checked = true;
                }
            }
        }

        return false;
    }

非常感谢您的帮助。

Answer 1

您的函数始终返回 false，这会阻止单选按钮被检查。

尝试这样的事情(未测试):

标记(注意我传递了对函数的元素引用):

<div class="col s12 form-section" id="crimeInsurance">
  <h4 class="section-heading">CRIME INSURANCE</h4>
  <p>
    <asp:RadioButton ID="radLLCrimeIns" runat="server" GroupName="CrimeInsurance" ClientIDMode="Static" CssClass="with-gap" OnClick="return CrimeInsuranceToggle(this);" AutoPostBack="true" text="ACCEPT Crime Insurance (fee of $250.00)" />
  </p>
  <p>
    <asp:RadioButton ID="radLLNOCrimeIns" runat="server" GroupName="CrimeInsurance" ClientIDMode="Static" CssClass="with-gap" OnClick="return CrimeInsuranceToggle(this);" AutoPostBack="true" text="DO NOT ACCEPT Crime Insurance" />
  </p>
</div>

Javascript:

function CrimeInsuranceToggle(rdo) {
  //controls the crime insurance radio yes/no buttons to update crime insurance fees
  var oCrimeRte = document.getElementById("lblCrimeCovFlatRate");
  var oCrimeTtl = document.getElementById("lblCrimeCovAmtDue");

  //find each radio that is checked, and act on the ID
  if (rdo.id == 'radLLCrimeIns') {
    oCrimeTtl.innerHTML = oCrimeRte.innerHTML;
  } else if (rdo.id == 'radLLNOCrimeIns') {
    oCrimeTtl.innerHTML = "0.00";
  }

  return rdo.checked;
}