1

次のように、ページにサーバー側の HTML 要素がいくつかあるとします。

<div id="cblDomain" runat="server">
    <input runat="server" id="cblDomain_com" value="10" onchange="subsumDomain()" type="checkbox" name="cblDomain" checked="checked"><label for="cblDomain_com">com - 10</label><br>
    <input runat="server" id="cblDomain_net" value="10" onchange="subsumDomain()" type="checkbox" name="cblDomain"><label for="cblDomain_net">net - 10</label><br>
    <input runat="server" id="cblDomain_info" value="5" onchange="subsumDomain()" type="checkbox" name="cblDomain"><label for="cblDomain_info">info - 5</label><br>
    <input runat="server" id="cblDomain_me" value="10" onchange="subsumDomain()" type="checkbox" name="cblDomain"><label for="cblDomain_me">me - 10</label>
</div>

<select runat="server" name="ddlDomainPeriod" onchange="subsumDomain()" id="ddlDomainPeriod">
    <option value="1">1 yr</option>
    <option value="2">2 yrs</option>
    <option value="3">3 yrs</option>
    <option value="4">4 yrs</option>
    <option value="5">5 yrs</option>
</select>
<div name="sum" id="sumDomain">10</div>

Domains & Year で計算を行い、結果を SUM (div) で表示したい。

JavaScript はrunat="server"属性がないので問題なく動作していましたが、動作していません。

そして、これがrunats を追加する前に使用した (動作する) JavaScript です:

    <script type="text/javascript">
        function subsumDomain() {
            var _sum = 0;
            var _cblDomain = document.getElementsByName('cblDomain');
            for (i = 0; i < _cblDomain.length; i++) {
                if (_cblDomain[i].checked == true)
                    _sum += Number(_cblDomain[i].value);
            }
            var _domainPeriod = Number(document.getElementById('ddlDomainPeriod').options[document.getElementById('ddlDomainPeriod').selectedIndex].value);
            document.getElementById('sumDomain').innerHTML = moneyConvert(_sum * _domainPeriod);
        }
</script>

現在、コードは私にとって複雑であり、修正して正しい答えを得る方法がわかりません。

どんな親切な助けも大歓迎です。

4

2 に答える 2

1

ここにはたくさんの問題があります：

あなたの下に、終了タグはinputsありbrません。

<input runat="server" id="cblDomain_com" value="10" onchange="subsumDomain()" type="checkbox" name="cblDomain" checked="checked"><label for="cblDomain_com">com - 10</label><br>

以下のコードをサーバーコントロールで動作させることができませんでした。配列は空でした。

var _cblDomain = document.getElementsByName('cblDomain');
var _cblDomain = $(".cblDomain :input"); <-- USE THIS INSTEAD (jQuery) *

また

document.getElementById('ddlDomainPeriod')
document.getElementById('<%= ddlDomainPeriod.ClientID %>') <-- USE THIS INSTEAD *

以下の完全に機能するコード：

マークアップ

<div class="cblDomain" id="cblDomain" runat="server">
  <input runat="server" id="cblDomain_com" value="10" onchange="subsumDomain()" type="checkbox" name="cblDomain" checked="checked" /><label for="cblDomain_com">com - 10</label><br>
  <input runat="server" id="cblDomain_net" value="10" onchange="subsumDomain()" type="checkbox" name="cblDomain"><label for="cblDomain_net" />net - 10</label><br>
  <input runat="server" id="cblDomain_info" value="5" onchange="subsumDomain()" type="checkbox" name="cblDomain"><label for="cblDomain_info" />info - 5</label><br>
  <input runat="server" id="cblDomain_me" value="10" onchange="subsumDomain()" type="checkbox" name="cblDomain"><label for="cblDomain_me" />me - 10</label>
</div>
  <select runat="server" name="ddlDomainPeriod" onchange="subsumDomain()" id="ddlDomainPeriod">
    <option value="1">1 yr</option>
    <option value="2">2 yrs</option>
    <option value="3">3 yrs</option>
    <option value="4">4 yrs</option>
    <option value="5">5 yrs</option>
  </select>
<div name="sum" id="sumDomain">10</div>

Javascript、jQueryも使用します。

function subsumDomain() {
  var _sum = 0;
  var _cblDomain = document.getElementsByName('cblDomain');
  var _cblDomain = $(".cblDomain :input");
  for (i = 0; i < _cblDomain.length; i++) {
    if (_cblDomain[i].checked == true)
      _sum += Number(_cblDomain[i].value);
  }
  var _domainPeriod = Number(document.getElementById('<%= ddlDomainPeriod.ClientID %>').options[document.getElementById('<%= ddlDomainPeriod.ClientID %>').selectedIndex].value);
  document.getElementById('sumDomain').innerHTML = _sum * _domainPeriod;
}
于 2013-03-07T11:53:54.010 に答える
0

runat = "server"を追加する前に機能していた場合、問題はおそらくASP.NETがコントロールのIDを変更したことが原因です。

ASP.NET 4を使用している場合は、ClientIDMode属性を使用して、IDの変更を停止できます（http://msdn.microsoft.com/en-us/library/system.web.ui.control.clientidmode.aspx） ：

たとえば、divは

<div id="cblDomain" runat="server" ClientIDMode="Static">

ドロップダウンは

<select runat="server" name="ddlDomainPeriod" onchange="subsumDomain()" id="ddlDomainPeriod" CliendIDMode="Static">

また、名前ではなくIDでdiv要素を取得するようにjavascriptを変更する必要があります。

var _cblDomain = document.getElementById('cblDomain');

ASP.NET 2を使用している場合は、コントロールのClientIDを取得する必要があります。javascriptが.aspxページの一部である場合は、次のように実行できます。

var _cblDomain = document.getElementById('<%= cblDomain.ClientID %>');
于 2013-03-07T11:56:42.510 に答える