调用JavaScript函数onClick

时间:2017-07-28 02:12:42

标签: javascript html asp.net radio-button

我的JavaScript工作正常,但单击时我的单选按钮不会显示为已选中。当我将alt + tab远离我的网页并且alt + tab返回时,它会在单选按钮周围显示阴影圆圈,但仍然没有正确的检查填充。这是为什么?

我希望这是一个简单的解决方法。我更新了我的asp单选按钮来调用JavaScript函数,因为我的ASP代码隐藏发出了回发并清除了我页面上的一些控件。毋庸置疑,使用asp c#代码后面的功能,单击时单选按钮正确检查。当单击JavaScript功能时,我只需要查看单选按钮上的检查。这是我的无线电控制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;
    }

非常感谢帮助。

1 个答案:

答案 0 :(得分: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;
}