这应该是人们填写纸质申请的指导帮助计划。在这个阶段，它只是一个概念证明，以后将更详细地完成。当人们回答问题时，会根据他们的答案向他们提出另一个问题，并最终会在申请的该部分给出说明。我想测试一下只是一遍又一遍地回答是的人。它适用于JS Fiddle，但是当我点击Firefox的Chrome中的New / Renew时，手风琴就不会出现了。然后我担心如果它确实出现，内部隐藏和显示功能将无法正常工作。感谢您提供任何帮助。
这是小提琴：http://jsfiddle.net/gullydwarf/zWaLx/11/
这是html：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1 /DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Permits FAQ</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript" src="new_renew_selection2.js"></script>
<link rel="stylesheet" type="text/css" href="new_renew_selection2.css" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css"/>
</head>
<body>
<br />
<div class="input-quest">What type of transaction would you like?</div>
<div class="input-resp">
<form>
<input id="question_1_response_newRenew" type="radio" name="button1" value="No" />
<label>New/Renew Permit</label>
<br />
<input id="question_1_response_transfer" type="radio" name="button1" value="No" />
<label>Transfer Permit</label>
</form>
</div>
<div>
<br />
<div class="accordion">
<h3>Section 1 - Vessel Information</h3>
<div>
<p>
<div>
<h2>Do you own a vessel with a current (not expired) State Registration or Coast Guard Documentation?</h2>
<p>
<input id="section_1_response_yes" type="radio" name="button1" value="No" />
<label class="labelName">Yes</label>
</p>
<div id="section_1_response_click_yes">Please fill out ALL the blocks with your vessel information.</div>
<br />
<p>
<input id="section_1_response_no" type="radio" name="button1" value="No" />
<label class="labelName">No</label>
</p>
<div id="section_1_response_click_no">If you are applying to renew a HMS, commercial swordfish or shark permit issued without a vessel, write "No Vessel" in the field for official USCG Number. All other permits require a vessel.</div>
</div>
</p>
</div>
<h3>Section 2 - Open Access Permits and Endorsements</h3>
<div>
<h2>Do you want Open Access Permits or Endorsements?</h2>
<p>
<input id="section_2_response_yes" type="radio" name="button1" value="No" />
<label class="labelName">Yes</label>
</p>
<div id="section_2_response_click_yes">Do you want a lobster tailing permit?
<div id="section_2_lobster_permit">
<p>
<input id="section_2_lobster_response_yes" type="radio" name="button1" value="No" />
<label class="labelName">Yes</label>
</p>
<div id="section_2_lobster_yes">Do you have a current Florida Saltwater Products License with a Crawfish Endorsement?
<div id="section_2_lobster_SPL">
<p>
<input id="section_2_lobster_SPL_yes" type="radio" name="button1" value="No" />
<label class="labelName">Yes</label>
</p>
<div id="section_2_lobster_SPL_yes">
<p>Please provide the Florida Saltwater Product's information in Section 2 and mail a copy of the license with the application.</p>
</div>
</div>
</div>
</div>
</div>
<input id="section_2_lobster_permit_response_no" type="radio" name="button1" value="No" />
<label class="labelName">No</label>
</p>
<br />
<div id="section_2_permit_reponse_answer_yes">Blah</div>
<h3>Section 4 - Individual Vessel Owner and Lessee Information </h3>
<div>
<p>Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In suscipit faucibus urna. </p>
</div>
<h3>Section 5 - Business Vessel Owner and Lessee Information</h3>
<div>
<p>Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In suscipit faucibus urna. </p>
</div>
<h3>Section 6 - Officer Shareholder Information</h3>
<div>
<p>Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In suscipit faucibus urna. </p>
</div>
</div>
</div>
</div>
</body>
</html>
这是Javascript：
// JavaScript Document For New Renew App Help
$(function () {
$(".accordion").accordion({
heightStyle: "content",
collapsible: true,
animated: 'slide',
navigation: true,
active: false,
});
});
$(document).ready(function () {
$("div.accordion").hide();
$("div#section_1_response_click_yes").hide();
$("div#section_1_response_click_no").hide();
$("div#section_2_response_click_yes").hide();
$("div#section_2_lobster_yes").hide();
$("div#section_2_lobster_SPL_yes").hide();
});
$("#question_1_response_newRenew").click(function () {
$("div.accordion").show();
});
$("#section_1_response_yes").click(function () {
$("div#section_1_response_click_yes").fadeIn("slow");
$("div#section_1_response_click_no").fadeOut("slow");
});
$("#section_1_response_no").click(function () {
$("div#section_1_response_click_no").fadeIn("slow");
$("div#section_1_response_click_yes").fadeOut("slow");
});
$("#section_2_response_yes").click(function () {
$("div#section_2_response_click_yes").show();
$("div#section_2_response_click_no").hide();
});
$("#section_2_response_no").click(function () {
$("div#section_2_response_click_no").show();
$("div#section_2_response_click_yes").hide();
});
$("#section_2_lobster_response_yes").click(function () {
$("div#section_2_lobster_yes").show();
$("div#section_2_lobster_no").hide();
});
$("#section_2_lobster_SPL_yes").click(function () {
$("div#section_2_lobster_SPL_yes").show();
$("div#section_2_lobster_SPL_no").hide();
});
这是CSS，但我认为这并不重要。
/* CSS Document */
h2 {
background-color:gold;
border-radius:5px 15px;
font-size:1em;
font-family:Tahoma, Geneva, sans-serif;
font-weight:bold;
padding:10px;
width:25%;
}
.labelName{
margin-bottom:25px;
color:blue;
}
#accordion{
margin-top:25px;
}
#section_2_response_click_yes{
margin-left:100px;
}
body {
width:772px;
}
答案 0 :(得分：1)
您应该将.click（）函数移动到$(document).ready(function () {，以便在页面加载时创建它们：
$(document).ready(function () {
//...other code
$("#question_1_response_newRenew").click(function () {
$("div.accordion").show();
});
//remaining functions...
});