私が知る限り、このスクリプトが IE 9 より前で機能しない理由についての提案を探しています。以前のブラウザ設定を IE 9 経由で使用してみましたが、IE 8 および 7 の標準で動作します。
<body>
<div class="custom-field-container form-row ">
<div class="form-content">
<div class="form-input-label-block">
<label for="date_of_birth_date_MONTH">Date Of Birth</label>
</div>
<fieldset>
<label for="date_of_birth_date_MONTH"><span style="display:none;">Month</span></label>
<label for="date_of_birth_date_DAY"><span style="display:none;">Day</span></label>
<label for="date_of_birth_date_YEAR"><span style="display:none;">Year</span></label>
<select name="date_of_birth_date_MONTH" id="date_of_birth_date_MONTH" title="Month">
<option value="1" >Jan</option>
<option value="2" >Feb</option>
<option value="3" >Mar</option>
<option value="4" >Apr</option>
<option value="5" >May</option>
<option value="6" >Jun</option>
<option value="7" >Jul</option>
<option value="8" >Aug</option>
<option value="9" >Sep</option>
<option value="10" selected="selected">Oct</option>
<option value="11" >Nov</option>
<option value="12" >Dec</option>
</select>
<select name="date_of_birth_date_DAY" id="date_of_birth_date_DAY" title="Day">
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
<option value="6" >6</option>
<option value="7" >7</option>
<option value="8" selected="selected">8</option>
<option value="9" >9</option>
<option value="10" >10</option>
<option value="11" >11</option>
<option value="12" >12</option>
<option value="13" >13</option>
<option value="14" >14</option>
<option value="15" >15</option>
<option value="16" >16</option>
<option value="17" >17</option>
<option value="18" >18</option>
<option value="19" >19</option>
<option value="20" >20</option>
<option value="21" >21</option>
<option value="22" >22</option>
<option value="23" >23</option>
<option value="24" >24</option>
<option value="25" >25</option>
<option value="26" >26</option>
<option value="27" >27</option>
<option value="28" >28</option>
<option value="29" >29</option>
<option value="30" >30</option>
<option value="31" >31</option>
</select>
<select name="date_of_birth_date_YEAR" id="date_of_birth_date_YEAR" title="Year">
<option value="2015" >2015</option>
<option value="2014" >2014</option>
<option value="2013" selected="selected">2013</option>
<option value="2012" >2012</option>
<option value="2011" >2011</option>
<option value="2010" >2010</option>
<option value="2009" >2009</option>
<option value="2008" >2008</option>
<option value="2007" >2007</option>
<option value="2006" >2006</option>
<option value="2005" >2005</option>
<option value="2004" >2004</option>
<option value="2003" >2003</option>
<option value="2002" >2002</option>
<option value="2001" >2001</option>
<option value="2000" >2000</option>
<option value="1999" >1999</option>
<option value="1998" >1998</option>
<option value="1997" >1997</option>
<option value="1996" >1996</option>
<option value="1995" >1995</option>
<option value="1994" >1994</option>
<option value="1993" >1993</option>
<option value="1992" >1992</option>
<option value="1991" >1991</option>
<option value="1990" >1990</option>
<option value="1989" >1989</option>
<option value="1988" >1988</option>
<option value="1987" >1987</option>
<option value="1986" >1986</option>
<option value="1985" >1985</option>
<option value="1984" >1984</option>
<option value="1983" >1983</option>
<option value="1982" >1982</option>
<option value="1981" >1981</option>
<option value="1980" >1980</option>
<option value="1979" >1979</option>
<option value="1978" >1978</option>
<option value="1977" >1977</option>
<option value="1976" >1976</option>
<option value="1975" >1975</option>
<option value="1974" >1974</option>
<option value="1973" >1973</option>
<option value="1972" >1972</option>
<option value="1971" >1971</option>
<option value="1970" >1970</option>
<option value="1969" >1969</option>
<option value="1968" >1968</option>
<option value="1967" >1967</option>
<option value="1966" >1966</option>
<option value="1965" >1965</option>
<option value="1964" >1964</option>
<option value="1963" >1963</option>
<option value="1962" >1962</option>
<option value="1961" >1961</option>
<option value="1960" >1960</option>
<option value="1959" >1959</option>
<option value="1958" >1958</option>
<option value="1957" >1957</option>
<option value="1956" >1956</option>
<option value="1955" >1955</option>
<option value="1954" >1954</option>
<option value="1953" >1953</option>
<option value="1952" >1952</option>
<option value="1951" >1951</option>
<option value="1950" >1950</option>
<option value="1949" >1949</option>
<option value="1948" >1948</option>
<option value="1947" >1947</option>
<option value="1946" >1946</option>
<option value="1945" >1945</option>
<option value="1944" >1944</option>
<option value="1943" >1943</option>
<option value="1942" >1942</option>
<option value="1941" >1941</option>
<option value="1940" >1940</option>
<option value="1939" >1939</option>
<option value="1938" >1938</option>
<option value="1937" >1937</option>
<option value="1936" >1936</option>
<option value="1935" >1935</option>
<option value="1934" >1934</option>
<option value="1933" >1933</option>
<option value="1932" >1932</option>
<option value="1931" >1931</option>
<option value="1930" >1930</option>
<option value="1929" >1929</option>
<option value="1928" >1928</option>
<option value="1927" >1927</option>
<option value="1926" >1926</option>
<option value="1925" >1925</option>
<option value="1924" >1924</option>
<option value="1923" >1923</option>
<option value="1922" >1922</option>
<option value="1921" >1921</option>
<option value="1920" >1920</option>
<option value="1919" >1919</option>
<option value="1918" >1918</option>
<option value="1917" >1917</option>
<option value="1916" >1916</option>
<option value="1915" >1915</option>
<option value="1914" >1914</option>
<option value="1913" >1913</option>
<option value="1912" >1912</option>
<option value="1911" >1911</option>
<option value="1910" >1910</option>
<option value="1909" >1909</option>
<option value="1908" >1908</option>
<option value="1907" >1907</option>
<option value="1906" >1906</option>
<option value="1905" >1905</option>
<option value="1904" >1904</option>
<option value="1903" >1903</option>
<option value="1902" >1902</option>
<option value="1901" >1901</option>
<option value="1900" >1900</option>
</select>
</fieldset>
<input type="hidden" name="date_of_birthsubmit" id="date_of_birthsubmit" value="true" />
</div>
</div>
<div>
<p>After entering your date of birth, click the 'Calculate Fee' button to determine what your one-time cost of lifetime membership will be.</p>
<div id="calculateAge" class="step-button next-step"> Calculate Fee </div>
<p id="feeInfo" style="display: none;">Your <span class="paymentNumber">one time fee</span> for lifetime membership totals just <span class="memberFee"></span> today.</p>
</div>
<div id="250group" style="display: none;">
<p>
<label>
<input id="fee250_0" name="fee250" type="radio" value="250s" />
Single
</label>
<br />
<label>
<input id="fee250_1" name="fee250" type="radio" value="250q" />
Quarterly
</label>
<br />
<label>
<input id="fee250_2" name="fee250" type="radio" value="250m" />
Monthly
</label>
</p>
</div>
<div id="230group" style="display: none;">
<p>
<label>
<input id="fee230_0" name="fee230" type="radio" value="230s" />
Single
</label>
<br />
<label>
<input id="fee230_1" name="fee230" type="radio" value="230q" />
Quarterly
</label>
<br />
<label>
<input id="fee230_2" name="fee230" type="radio" value="230m" />
Monthly
</label>
</p>
</div>
<div id="180group" style="display: none;">
<p>
<label>
<input id="fee180_0" name="fee180" type="radio" value="180s" />
Single
</label>
<br />
<label>
<input id="fee180_1" name="fee180" type="radio" value="180q" />
Quarterly
</label>
<br />
<label>
<input id="fee180_2" name="fee180" type="radio" value="180m" />
Monthly
</label>
</p>
</div>
<div id="140group" style="display: none;">
<p>
<label>
<input id="fee140_0" name="fee140" type="radio" value="140s" />
Single
</label>
<br />
<label>
<input id="fee140_1" name="fee140" type="radio" value="140q" />
Quarterly
</label>
<br />
<label>
<input id="fee140_2" name="fee140" type="radio" value="140m" />
Monthly
</label>
</p>
</div>
</body>
そしてスクリプト：
var $j = jQuery.noConflict();
var $ = $j;
function calcAge(dateString) {
var birthday = +new Date(dateString);
return ~~((Date.now() - birthday) / (31557600000));
}
$j(document).ready(function() {
$j( "#calculateAge" ).click(function getdateString() {
var dobYear = $j("#date_of_birth_date_YEAR").val();
var dobMonth = $j("#date_of_birth_date_MONTH").val();
var goodMonth = ( '0' + (dobMonth) ).slice( -2 );
var dobDay = $j("#date_of_birth_date_DAY").val();
var goodDay = ( '0' + (dobDay) ).slice( -2 );
var dateString = dobYear+"/"+goodMonth+"/"+goodDay;
var ageRange = calcAge(dateString);
// alert(ageRange);
// alert(dateString);
if (ageRange < 41) {
$j("#250group, #feeInfo").css("display","inline");
$j("#140group, #230group, #180group").css("display","none");
$j("#level_installmentexpanded15681, #level_installmentexpanded15684, #level_installmentexpanded15686").prop('checked',false);
$j("#level_installmentexpanded15683").prop('checked',true);
$j(".memberFee").html("$250.00");
// CleanUp();
}
else if (ageRange < 61) {
$j("#230group, #feeInfo").css("display","inline");
$j("#250group, #140group, #180group").css("display","none");
$j("#level_installmentexpanded15683, #level_installmentexpanded15686, #level_installmentexpanded15681").prop('checked',false);
$j("#level_installmentexpanded15684").prop('checked',true);
$j(".memberFee").html("$230.00");
// CleanUp();
}
else if (ageRange < 71) {
$j("#180group, #feeInfo").css("display","inline");
$j("#250group, #230group, #140group").css("display","none");
$j("#level_installmentexpanded15683, #level_installmentexpanded15684, #level_installmentexpanded15681").prop('checked',false);
$j("#level_installmentexpanded15686").prop('checked',true);
$j(".memberFee").html("$180.00");
// CleanUp();
}
else if (ageRange < 80) {
$j("#140group, #feeInfo").css("display","inline");
$j("#250group, #230group, #180group").css("display","none");
$j("#level_installmentexpanded15683, #level_installmentexpanded15684, #level_installmentexpanded15686").prop('checked',false);
$j("#level_installmentexpanded15681").prop('checked',true);
$j(".memberFee").html("$140.00");
// CleanUp();
}
else if (ageRange > 79) {
window.location = 'http://externalsurvey.org/site/Survey?ACTION_REQUIRED=URI_ACTION_USER_REQUESTS&SURVEY_ID=####';
}
else {
$j('.don-tb tr').css("display","inline");
// CleanUp();
}
});
})
$j( "#fee250_0" ).click(function() {
$j("#level_installmentduration").val("S:0");
$j(".memberFee").html("$250.00");
$j(".paymentNumber").html("one time fee");
});
$j( "#fee250_1" ).click(function() {
$j("#level_installmentduration").val("Q:9");
$j(".memberFee").html("$30.00");
$j(".paymentNumber").html("9 easy quarterly payments");
});
$j( "#fee250_2" ).click(function() {
$j("#level_installmentduration").val("M:25");
$j(".memberFee").html("$10.00");
$j(".paymentNumber").html("25 easy monthly payments");
});
$j( "#fee230_0" ).click(function() {
$j("#level_installmentduration").val("S:0");
$j(".memberFee").html("$230.00");
$j(".paymentNumber").html("one time fee");
});
$j( "#fee230_1" ).click(function() {
$j("#level_installmentduration").val("Q:8");
$j(".memberFee").html("$30.00");
$j(".paymentNumber").html("8 easy quarterly payments");
});
$j( "#fee230_2" ).click(function() {
$j("#level_installmentduration").val("M:23");
$j(".memberFee").html("$10.00");
$j(".paymentNumber").html("23 easy monthly payments");
});
$j( "#fee180_0" ).click(function() {
$j("#level_installmentduration").val("S:0");
$j(".memberFee").html("$180.00");
$j(".paymentNumber").html("one time fee");
});
$j( "#fee180_1" ).click(function() {
$j("#level_installmentduration").val("Q:6");
$j(".memberFee").html("$30.00");
$j(".paymentNumber").html("6 easy quarterly payments");
});
$j( "#fee180_2" ).click(function() {
$j("#level_installmentduration").val("M:18");
$j(".memberFee").html("$10.00");
$j(".paymentNumber").html("18 easy monthly payments");
});
$j( "#fee140_0" ).click(function() {
$j("#level_installmentduration").val("S:0");
$j(".memberFee").html("$140.00");
$j(".paymentNumber").html("one time fee");
});
$j( "#fee140_1" ).click(function() {
$j("#level_installmentduration").val("Q:5");
$j(".memberFee").html("$30.00");
$j(".paymentNumber").html("5 easy quarterly payments");
});
$j( "#fee140_2" ).click(function() {
$j("#level_installmentduration").val("M:14");
$j(".memberFee").html("$10.00");
$j(".paymentNumber").html("14 easy monthly payments");
});
「これの何が問題なのか」という質問を投稿するのは嫌いですが、困惑しており、古いブラウザーでテストする他の方法を試す前に、洞察を得たいと思っていました. level_installment ID は CRM の構造の一部であり、これについては無視できます。
アラートを設定し、現在コメント アウトしていますが、他のテストで最も重要なデータ ステップを報告する傾向があります。これらは、個別の年齢 (例: 43) または日付 (例: 12/11/2013) を与えることを意図しています。私のリバース ブラウザー標準テストでは、これらは問題なく表示されました。