1
Я уже некоторое время изучаю JQuery, и я создал скрипт, который, когда я нажимаю на div (#click), еще один div (#slide) будет скользить вниз и показывать содержимое внутри. Ниже приведен сценарий, который я написал, чтобы сделать это для меня, но я чувствую, что он слишком повторяющийся. Должен быть лучший способ достичь тех же результатов, но с гораздо меньшим количеством кода. Я googled, но не смог найти никаких решений, Любые идеи кто-нибудь?Как я могу конденсировать этот код JQuery?
$(document).ready(function(){
$("#click").click(function(){
$("#slide").slideToggle("slow");
});
$("#click2").click(function(){
$("#slide2").slideToggle("slow");
});
$("#click3").click(function(){
$("#slide3").slideToggle("slow");
});
$("#click4").click(function(){
$("#slide4").slideToggle("slow");
});
$("#click5").click(function(){
$("#slide5").slideToggle("slow");
});
$("#click6").click(function(){
$("#slide6").slideToggle("slow");
});
$("#click7").click(function(){
$("#slide").slideToggle("slow");
});
$("#click8").click(function(){
$("#slide8").slideToggle("slow");
});
$("#click9").click(function(){
$("#slide9").slideToggle("slow");
});
$("#click10").click(function(){
$("#slide10").slideToggle("slow");
});
$("#click11").click(function(){
$("#slide11").slideToggle("slow");
});
$("#click12").click(function(){
$("#slide12").slideToggle("slow");
});
$("#click13").click(function(){
$("#slide13").slideToggle("slow");
});
$("#click14").click(function(){
$("#slide14").slideToggle("slow");
});
$("#click15").click(function(){
$("#slide15").slideToggle("slow");
});
$("#click16").click(function(){
$("#slide16").slideToggle("slow");
});
$("#click17").click(function(){
$("#slide17").slideToggle("slow");
});
$("#click18").click(function(){
$("#slide18").slideToggle("slow");
});
$("#click19").click(function(){
$("#slide19").slideToggle("slow");
});
});
Я знаю, что это некрасиво, но Единственный ключ у меня есть, чтобы использовать ключевое слово (это), но я не знаю, как это осуществить. Поэтому помощь была бы весьма признательна.
вот HTML:
<div id="main">
<div class="content">
<img src="images/training.jpg" alt="banner" class="pic"/>
<h3>10 Hour Construction</h3>
<p> This <span class="theme">10 Hour</span> program is intended to provide instruction on a variety of construction safety and
health standards to entry-level participants. Your employees will receive an acknowledgement of
completion & wallet card upon completion of the training.</p>
</div><!-- content div -->
<div id="click">
<p>Show More/Show Less</p>
</div>
<div id="slide">
<h4>Mandatory Topics 7 Hours:</h4>
<ul class="services">
<li>Intro to OSHA- 2 Hours</li>
<li>Focus Four - 4 Hours: Fall Protection- Minimum 1hr. 15 Minutes, Electrical-Minimum 30 Minutes, Struck by
Minimum 30 Minutes & Caught in or Between Minimum 30 Minutes</li>
<li>Personal Protective & Life Saving Equipment - Minimum 30 Minutes</li>
<li>Health Hazards in Construction - Minimum 30 Minutes</li>
<li>Stairways & Ladders - 30 minutes</li>
</ul>
<h4>Elective Topics 2 Hours:</h4>
<ul class="services">
<li>Material Handling, Storage, Use and Disposal, Subpart H</li>
<li>Tools- Hand and Power, Subpart I</li>
<li>Scaffold, Subpart L</li>
<li>Cranes, Derricks, Hoists, Elevators, & Conveyors, Subpart N</li>
<li>Excavation, Subpart P</li>
</ul>
<h4>Optional Topics 1 Hour:</h4>
<ul class="services">
<li>Subpart H: Materials Handling, Storage, Use and Disposal</li>
<li>Subpart N: Cranes, Derricks, Hoists, Elevators, and Conveyors</li>
<li>Subpart O: Motor Vehicles, Mechanized Equipment; Construction Equipment</li>
<li>Subpart L: Scaffolding</li>
<li>Subpart P: Excavations</li>
<li>Subpart X: Stairways and Ladders</li>
<li>Subpart D: Occupational Health & Environmental Controls (Emphasis on Hazard Communication)</li>
<li>Subpart E: Personal Protective Equipment</li>
<li>Subpart F: Fire Protection and Prevention</li>
<li>Subpart G: Signs, Signals, and Barricades</li>
<li>Subpart I: Tools – Hand and Power</li>
<li>Subpart J: Welding and Cutting</li>
<li>Subpart Q: Concrete and Masonry Construction</li>
<li>Subpart R: Steel Erection</li>
<li>Subpart S: Underground Construction, Caissons, Cofferdams & Compressed Air</li>
<li>Subpart T: Demolition</li>
<li>Subpart U: Blasting and Use of Explosives</li>
<li>Subpart V: Power Transmission and Distribution</li>
<li>Subpart W: Rollover Protective Structures</li>
<li>Subpart Z: Toxic and Hazardous Substances</li>
<li>1910 Confined Spaces</li>
<li>29 CFR 1904: Recordkeeping, OSHA Forms 300, 300A & 301</li>
</ul>
</div><!-- slide div -->
<div class="content">
<h3>10 Hour General Industry</h3>
<p> This <span class="theme">10 Hour</span> program is intended to provide instruction on a variety of general industry safety and
health standards to entry-level participants. Your employees will receive an acknowledgement of
completion & wallet card upon completion of the training.</p>
</div>
<div id="click2">
<p>Show More/Show Less</p>
</div>
<div id="slide2">
<h4>Mandatory Topics 7 Hours:</h4>
<ul class="services">
<li>Intro to OSHA- 2 Hours</li>
<li>Walking and Working Surfaces, including fall protection – 1 Hour</li>
<li>Exit Routes, Emergency Action Plans, Fire Prevention Plans, and Fire Protection – 1 Hour</li>
<li>Electrical – 1 Hour</li>
<li>Personal Protective Equipment – 1 Hour</li>
<li>Hazard Communication – 1 Hour</li>
</ul>
<h4>Elective Topics 2 Hours:</h4>
<ul class="services">
<li>Hazardous Materials Tools- Hand and Power, Subpart I</li>
<li>Materials Handling</li>
<li>Machine Guarding</li>
<li>Introduction to Industrial Hygiene</li>
<li>Bloodborne Pathogens</li>
<li>Ergonomics</li>
<li>Safety & Health Program</li>
<li>Fall Protection</li>
</ul>
</div><!-- slide div -->
<div class="content">
<h3>30 Hour Construction</h3>
<p> This <span class="theme">30 Hour</span> program is intended to provide instruction on a variety of construction safety and health
standards to entry-level and intermediate-level participants. Your employees will receive an
acknowledgement of completion & wallet card upon completion of the training.</p>
</div><!--content div -->
<div id="click3">
<p>Show More/Show Less</p>
</div>
<div id="slide3">
<h4>Mandatory Topics 15 Hours:</h4>
<ul class="services">
<li>Intro to OSHA - 2 Hours</li>
<li>Managing Safety & Health - 2 Hours</li>
<li>Focus Four- 6 Hours: Fall Protection - Minimum 1 Hour 15 Minutes, Electrical-Minimum 30 Minutes, Struck
by Minimum 30 Minutes & Caught in or Between Minimum 30 Minutes</li>
<li>Personal Protective & Life Saving Equipment - 2 Hours</li>
<li>Health Hazards in Construction - 2 Hours</li>
<li>Stairways & Ladders - 1 Hour</li>
</ul>
<h4>Elective Topics 12 Hours:</h4>
<ul class="services">
<li>STD 3-1.1 "Clarification of Citation Policy Regarding 29 CFR 1926.20, 29 CFR 1926.21 and Related General
Safety and Health Provisions"; Safety Programs</li>
<li>Fire Protection and Prevention, Subpart F</li>
<li>Material Handling, Storage, Use and Disposal, Subpart H</li>
<li>Tools- Hand and Power, Subpart I</li>
<li>Welding and Cutting, Subpart J</li>
<li>Scaffold, Subpart L</li>
<li>Cranes, Derricks, Hoists, Elevators, and Conveyers, Subpart N</li>
<li>Motor Vehicles, Mechanized Equipment and Marine Operations; Rollover Protective Structures and Overhead</li>
<li>Protection; and Signs, Signals and Barricades, Subpart O, W and G</li>
<li>Excavations, Subpart P</li>
<li>Concrete and Masonry Construction, Subpart Q</li>
<li>Steel Erection, Subpart R</li>
<li>Confined Space Entry</li>
<li>Power Industrial Vehicles</li>
</ul>
<h4>Optional Topics 3 Hours:</h4>
<ul class="services">
<li>Subpart D: Occupational Health & Environmental Controls (Emphasis on Hazard Communication)</li>
<li>Subpart E: Personal Protective Equipment</li>
<li>Subpart F: Fire Protection and Prevention</li>
<li>Subpart G: Signs, Signals, and Barricades</li>
<li>Subpart I: Tools – Hand and Power</li>
<li>Subpart J: Welding and Cutting</li>
<li>Subpart Q: Concrete and Masonry Construction</li>
<li>Subpart R: Steel Erection</li>
<li>Subpart S: Underground Construction, Caissons, Cofferdams and Compressed Air</li>
<li>Subpart T: Demolition</li>
<li>Subpart U: Blasting and Use of Explosives</li>
</ul>
</div>
<div class="content">
<h3>30 Hour General Industry</h3>
<p> This <span class="theme">30 Hour</span> program is intended to provide instruction on a variety of general industry safety and health
standards to entry-level and intermediate-level participants. Your employees will receive an
acknowledgement of completion & wallet card upon completion of the training.</p>
</div>
<div id="click4">
<p>Show More/Show Less</p>
</div>
<div id="slide4">
<h4>Mandatory Topics 13 Hours:</h4>
<ul class="services">
<li>Intro to OSHA - 2 Hours</li>
<li>Managing Safety & Health - 2 Hours</li>
<li>Walking and Working Surfaces, including Fall Protection - 1 Hour</li>
<li>Exit Routes, Emergency Action Plans, Fire Prevention Plans, and Fire Protection - 2 Hours</li>
<li>Electrical - 2 Hours</li>
<li>Personal Protective Equipment (PPE) - 1 Hour</li>
<li>Materials Handling - 2 Hours</li>
<li>Hazard Communication -1 Hour</li>
</ul>
<h4>Elective Topics 10 Hours:</h4>
<ul class="services">
<li>Hazardous Materials (Flammable and Combustible Liquids, Spray Finishing, Compressed Gases, Dipping and Coating Operations)</li>
<li>Permit-Required Confined Spaces</li>
<li>Lockout/Tagout</li>
<li>Machine Guarding</li>
<li>Welding, Cutting, and Brazing</li>
<li>Introduction to Industrial Hygiene</li>
<li>Bloodborne Pathogens</li>
<li>Ergonomics</li>
<li>Fall Protection</li>
<li>Safety and Health Programs</li>
<li>Powered Industrial Vehicles</li>
</ul>
<h4>Optional Topics 7 Hours:</h4>
<ul class="services">
<li>Teach other general industry hazards or policies and/or expand on the mandatoryor elective topics.</li>
<li>The minimum length of any topic is one-half hour.</li>
</ul>
</div>
<div class="content">
<h3>Aerial Boom Lift/Scissor Lift Operator Safety Course</h3>
<p> This program consists of classroom instruction and hands-on performance testing. The hands-on
training will be conducted at your location on your equipment. Your employees will receive an
acknowledgement of completion & wallet card upon completion of the training. Listed below are the
topics presented.</p>
</div>
<div id="click5">
<p>Show More/Show Less</p>
</div>
<div id="slide5">
<h4>Classroom Instruction:</h4>
<ul class="services">
<li>Manufacturer Safety & Operation Video Presentation</li>
<li>Manufacturer Safety & Operators Manual</li>
<li>OSHA/ Manufacturer Regulations - Operator’s Responsibilities & User release/ indemnity</li>
<li>Nomenclature - Safety Placards & Component Identification</li>
<li>Pre-operation Inspection - Hydraulics (all hydraulic components must be retracted to get accurate reading of hydraulic level)</li>
<li>Operators Responsibilities</li>
<li>Work Site Assessment- Identification of Site Hazards</li>
<li>Site Conditions- Terrain, Wind, Existing Hazards</li>
<li>Function Test- Ground Controls versus Platform Controls</li>
<li>Safe Operation of Equipment - 4 Steps to Positioning - Ramp, Direction of Travel- Directional Arrows, Emergency Shutdown</li>
<li>Equipment Stability - Center of Gravity, Personnel & Load Capacity</li>
<li>Egress to Platform - 3 points of contact, Body position for exiting</li>
<li>Transfer to Structures from the Equipment</li>
<li>Electrical Hazards - Minimum Approach Distance</li>
<li>Fall Protection - Body Harness & Tie Off Points</li>
<li>Proper Shutdown of the Equipment</li>
<li>Repair & Maintenance - Authorized Personnel & Annual Inspection</li>
<li>Passenger Training Requirements & Communication</li>
<li>Load Capacity of the Personnel Platform</li>
<li>Written Exam</li>
</ul>
<h4>Hands On Instruction:</h4>
<ul class="services">
<li>Pre-operation Inspection of the Equipment</li>
<li>Work Site Assessment</li>
<li>Function & Controls Testing</li>
<li>Hands on Performance Testing</li>
<li>Steps to Shut Down the Equipment</li>
</ul>
</div>
<div class="content">
<h3>Heavy Equipment Operator - Backhoe/Front-End Loader, Mini Excavator, Skid Steer Loader, Dozer, etc..</h3>
<p> According to the manufacturer, all employees who operate heavy equipment must be trained and
qualified by the company. In this course, we will train the student in the skills needed to safely
operate heavy equipment. Hands-on operation will also be performed on heavy equipment provided
by your company. Your employees will receive an acknowledgement of completion & wallet card
upon completion of the training.</p>
</div>
<div id="click6">
<p>Show More/Show Less</p>
</div>
<div id="slide6">
<h4>Heavy Equipment-related topics:</h4>
<ul class="services">
<li>OSHA/ Manufacturer Regulations Operating instructions, warnings, and precautions for heavy equipment the operator will be authorized
to operate</li>
<li>Pre operation Inspection</li>
<li>Heavy equipment controls and instrumentation: where they are located, what they do, and how they work</li>
<li>Steering and maneuvering</li>
<li>Visibility (including restrictions due to loading)</li>
<li>Vehicle capacity/ stability</li>
<li>Any vehicle inspection and maintenance that the operator will be required to perform</li>
<li>Refueling and/or charging and recharging of batteries</li>
<li>Any other operating instructions, warnings, or precautions listed in the operator’s manual for the types of vehicle that the employee is being trained to operate</li>
</ul>
<h4>Workplace-related topics:</h4>
<ul class="services">
<li>Surface conditions where the heavy equipment will be operated</li>
<li>Composition of loads to be carried and load stability</li>
<li>Pedestrian traffic in areas where the equipment will be operated</li>
<li>Hazardous (classified) locations where the equipment will be operated</li>
<li>Ramps and other sloped surfaces that could affect the equipment’s stability</li>
<li>Closed environments and other areas where insufficient ventilation or poor vehicle maintenance could cause a buildup of carbon monoxide or diesel exhaust.</li>
<li>Other unique or potentially hazardous environmental conditions in the workplace that could affect safe operation</li>
<li>Hands-on training conducted on your equipment at your facility</li>
<li>We will finish up with a written exam & open discussion.</li>
</ul>
</div>
<div class="content">
<h3>Rigging & Signal Communication Safety Training</h3>
<p> This program consists of classroom instruction and hands-on performance
testing. Power point Presentation & hands on instruction will be used to discuss
the general rigging procedures & OSHA guidelines. The hands-on training will be
conducted at your location using your equipment.</p>
</div>
<div id="click7">
<p>Show More/Show Less</p>
</div>
<div id="slide7">
<h4>Material Handling/ Rigging:</h4>
<ul class="services">
<li>OSHA Subpart H Regulations Material Handling, Storage, Use, and Disposal</li>
<li>Designation of the Qualified Rigger - OSHA Subpart CC Training Requirements</li>
<li>Inspection & Maintenance of the Rigging Equipment</li>
<li>Work Site Assessment - Identification of Site Hazards</li>
<li>Determination of Load Weight & Load Capacity of the Rigging Equipment</li>
<li>Sling Angle Tensions - 90, 60, 45 and 30 Degree Angles</li>
<li>Load Angle Factor Formula</li>
<li>Rigger’s Capacity Card Review in Detail.</li>
<li>Establishing Swing Zone & Radius Clearance</li>
<li>Written Exam</li>
</ul>
<h4>Hand Signals/Communication:</h4>
<ul class="services">
<li>OSHA Crane Subpart CC Hand Signal Regulations</li>
<li>Designation of the qualified Signal Person - Training Requirements</li>
<li>Rigger’s Hand Signal Card Review in Detail.</li>
<li>Establishing Communication- Hand Signals & Radio Communication with Crane Operators & Contractors on Site.</li>
<li>Written Exam</li>
</ul>
</div>
<div class="content">
<h3>Industrial Lift Truck/ Rough Terrain Forklift Operator Safety</h3>
<p> According to <span class="theme">OSHA (29 CFR 1910.178)</span>, all employees who operate a Powered Industrial Truck/
Rough Terrain Forklift must be trained and authorized by the company prior to operation. In this
course, we will train the student in the skills needed to safely operate a standard, rough terrain, gas-
propane and/or electric Forklift Truck. Hands-on practice using an actual Forklift through an
obstacle course is the highlight of this class. Your employees will receive an acknowledgement of
completion & wallet card upon completion of the training.</p>
</div>
<div id="click8">
<p>Show More/Show Less</p>
</div>
<div id="slide8">
<h4>Truck-related topics:</h4>
<ul class="services">
<li>OSHA/ Manufacturer Regulations
<li>Operating instructions, warnings, and precautions for the types of truck the operator will be authorized to operate</li>
<li>Differences between the truck and the automobile</li>
<li>Truck controls and instrumentation: where they are located, what they do, and how they work</li>
<li>Engine or motor operation</li>
<li>Steering and maneuvering</li>
<li>Visibility (including restrictions due to loading)</li>
<li>Fork and attachment adaptation, operation, and use limitations</li>
<li>Vehicle capacity</li>
<li>Vehicle stability</li>
<li>Any vehicle inspection and maintenance that the operator will be required to perform</li>
<li>Refueling and/or charging and recharging of batteries</li>
<li>Operating limitations</li>
<li>Any other operating instructions, warnings, or precautions listed in the operator’s manual for the types of
vehicle that the employee is being trained to operate</li>
</ul>
<h4>Workplace-related topics:</h4>
<ul class="services">
<li>Surface conditions where the vehicle will be operated</li>
<li>Composition of loads to be carried and load stability</li>
<li>Load manipulation, stacking, and unstacking</li>
<li>Pedestrian traffic in areas where the vehicle will be operated</li>
<li>Narrow aisles and other restricted places where the vehicle will be operated</li>
<li>Hazardous (classified) locations where the vehicle will be operated</li>
<li>Ramps and other sloped surfaces that could affect the vehicle’s stability</li>
<li>Closed environments and other areas where insufficient ventilation or poor vehicle maintenance could cause
a buildup of carbon monoxide or diesel exhaust.</li>
<li>Other unique or potentially hazardous environmental conditions in the workplace that could affect safe operation</li>
<li>Hands-on portion done on your machine at your facility</li>
</ul>
</div>
<div class="content">
<h3>Scaffolding User & Competency Safety</h3>
<p> The purpose of this course is to provide the scaffold erector, users and scaffold inspector the
knowledge of the OSHA regulations, safety guidelines, procedures and best work practices needed to
recognize and eliminate hazards in the field. This course supports the designation of the competent
person as required by OSHA. Your employees will receive an acknowledgement of completion &
wallet card upon completion of the training.</p>
</div>
<div id="click9">
<p>Show More/Show Less</p>
</div>
<div id="slide9">
<h4>Classroom Instruction:</h4>
<ul class="services">
<li>OSHA Subpart L Scaffold Safety Regulations</li>
<li>Safety Training Requirements for the Users, Erector & Competent Person</li>
<li>Competent Person’s Role & Responsibilities</li>
<li>Scaffold Inspection Process</li>
<li>Multi User/Indemnification Process</li>
<li>Applications and Components Associated with Frame, System, Suspended, Tube & Clamp and
Mobile Scaffolding</li>
<li>Fall Protection/ Guardrail Guidelines</li>
<li>Requirements for Ties and Affect of Wind Force on Scaffolds</li>
<li>Scaffold Planks & Platform Requirements</li>
<li>Scaffold Egress</li>
<li>Accidents & Fatal statistics</li>
<li>Written Exam</li>
</ul>
<h4>Hands on Instruction:</h4>
<ul class="services">
<li>Erection & inspection of scaffolding provided by the client if available</li>
<li>We will finish with an open discussion</li>
</ul>
</div>
<div class="content">
<h3>Fall Protection Guidelines & Equipment User</h3>
<p> This fall protection class uses real-world examples to enhance the understanding of diverse and
complex requirements under the very stringent <span class="theme">OSHA fall protection</span> standard. A presentation of
photographs and videos of actual job-sites and hands on practice helps students to see the benefits
and limitations of many fall protection systems and how they can be used to work safely. Your
employees will receive an acknowledgement of completion & wallet card upon completion of the
training.</p>
</div>
<div id="click10">
<p>Show More/Show Less</p>
</div>
<div id="slide10">
<h4>Required Topics:</h4>
<ul class="services">
<li>Regulatory requirements under (29 CFR 1926.500)</li>
<li>Principles of fall protection and hazards</li>
<li>Fall arrest systems and their components</li>
</ul>
<h4>Topics Presented:</h4>
<ul class="services">
<li>Subpart M Regulations</li>
<li>Accidents & Fatal Statistics</li>
Fall protection systems, which include guardrail systems, safety nets, personal fall arrest
systems, safety monitoring systems, controlled access zones, hole covers, and warning lines.
<li>Each system will be discussed in detail.</li>
<li>Approved Engineered/Manufactured Systems and Components</li>
<li>Approved Anchorage points</li>
<li>Approved connectors</li>
<li>Fall distance from anchor point to lower level</li>
<li>Written Exam</li>
<li>We will finish with an open discussion</li>
</ul>
<h4>Fall Protection Devices Hands On:</h4>
<ul class="services">
<li>Full body harness & lanyard- We will fit and inspect the body harness</li>
<li>Anchor connectors- cross arm strap & beam clamp</li>
</ul>
</div>
<div class="content">
<h3>Fire Protection & Extinguisher Use</h3>
<p> The purpose of this class is to identify potential fire hazards at the work place, fire protection
methods to include storage of flammable/combustible materials and fire protection planning. A
presentation of photographs of actual job-sites and hands on practice helps students to identify
potential fire exposure at the work place. Your employees will receive an acknowledgement of
completion & wallet card upon completion of the training.</p>
</div>
<div id="click11">
<p>Show More/Show Less</p>
</div>
<div id="slide11">
<h4>Required Topics:</h4>
<ul class="services">
<li>Regulatory requirements under (29 CFR 1926.150) OSHA Subpart F</li>
<li>Fire Elements & Hazards</li>
<li>The fire triangle - Oxygen, Fuel & Heat</li>
<li>Identify different classes of fires - Type A, B, C, D, K, Carbon Dioxide, Halogen, etc.</li>
</ul>
</div>
</div>
</div> <!--main div -->
должны быть размещены на просмотр кода - http://codereview.stackexchange.com/ – lifetimes
Не могли бы вы показать нам часть вашего HTML? Если у них есть определенная связь в DOM, вы можете свести ее к одной строке – Kenneth
$ ("# click7"). Click (function() {$ ("# slide"). SlideToggle ("slow"); это опечатка или числа, которые не всегда совпадают? – jamil