如何为NOOB重构jquery代码
我有以下代码似乎无法重构:如何为NOOB重构jquery代码,jquery,refactoring,Jquery,Refactoring,我有以下代码似乎无法重构: //opens some drop downs $('#proofreading').mouseover(function(){ $('.proofreading .accordion-body').collapse('show'); }); $('#edit').mouseover(function(){ $('.edit .accordion-body').coll
//opens some drop downs
$('#proofreading').mouseover(function(){
$('.proofreading .accordion-body').collapse('show');
});
$('#edit').mouseover(function(){
$('.edit .accordion-body').collapse('show');
});
$('#on_time').mouseover(function(){
$('.on_time .accordion-body').collapse('show');
});
以下是html中的代码:
<div class='content-more'>
<br>
<span id='proofreading'>
Read More...
</span>
</div>
<div class='accordion proofreading'>
<div class='accordion-group'>
<div class='accordion-body collapse'>
<div class='accordion-inner'>
<p class='content-desc'>
<br>
When your work is proofread at EAPI we will go over your text word by word, line by line correcting the spelling, punctuation, grammar, terminology, jargon, and semantics. As a result, your writing will be clear, correct, concise, comprehensible, and consistent: the <b>EAPI 5C standard</b>.
</p>
</div>
<br>
<span class='content-more close-accordion'>
close
</span>
</div>
</div>
</div>
<div class='content-more'>
<br>
<span id='edit'>
read more...
</span>
</div>
<div class='accordion edit'>
<div class='accordion-group'>
<div class='accordion-body collapse'>
<div class='accordion-inner'>
<p class='content-desc'>
<br>
When your work is edited at EAPI we will check and improve the formatting, style and accuracy of the text without altering the intended meaning.
</p>
<span class='content-more close-accordion'>
close
</span>
</div>
</div>
</div>
<div class='content-more'>
<br>
<span id='on_time'>
Read more...
</span>
</div>
<div class='accordion on_time'>
<div class='accordion-group'>
<div class='accordion-body collapse'>
<div class='accordion-inner'>
<p class='content-desc'>
<br>
When your work is proofread at EAPI we will go over your text word by word, line by line correcting the spelling, punctuation, grammar, terminology, jargon, and semantics. As a result, your writing will be clear, correct, concise, comprehensible, and consistent: the <b>EAPI 5C standard</b>.
</p>
</div>
<br>
<span class='content-more close-accordion'>
close
</span>
</div>
</div>
</div>
阅读更多。。。
当您的作品在EAPI进行校对时,我们将逐字逐行检查您的文本,纠正拼写、标点符号、语法、术语、行话和语义。因此,您的写作将清晰、正确、简洁、易懂且一致:EAPI 5C标准。
关闭
阅读更多。。。
在EAPI编辑您的作品时,我们将检查并改进文本的格式、样式和准确性,而不会改变预期的含义。
关闭
阅读更多。。。
当您的作品在EAPI进行校对时,我们将逐字逐行检查您的文本,纠正拼写、标点符号、语法、术语、行话和语义。因此,您的写作将清晰、正确、简洁、易懂且一致:EAPI 5C标准。
关闭
如何重构代码,使我不需要id,只需使用一个类,并减少对三个jquery语句的需要。将class=“accordion header”
添加到校对,编辑,以及实时div中。然后:
$(".accordion-header").mouseover(function() {
$('.' + this.id + ' .accordion-body').collapse('show');
});
我建议从更改HTML标记开始。使用ID来封装相关内容,您不必使用时间、编辑和校对来再次识别相关内容。