Question

的header.php

<?
$req = mysql_query('SELECT * FROM Groupe ORDER BY Groupe_Ordre ASC');

while($myrow = mysql_fetch_array($req))
{
$Groupe_id = $myrow['Groupe_id'] ;

echo "<div class='Sous-Menu' name='Sous-Menu-$Groupe_id'></div>";
}
?>

的script.js

$("div[name='Groupe-7']").mouseover(function(){ 
   $('.Sous-Menu').hide(); 
   $("div[name='Sous-Menu-7']").show(00); 
});

$("div[name='Groupe-8']").mouseover(function(){ 
   $('.Sous-Menu').hide(); 
   $("div[name='Sous-Menu-8']").show(00); 
});

...

Hello StackOverFlow，

在“Script.js”页面中，每个“Groupe”都有很多重复的行。

如何自动化“Script.js”？

Answer 1

我认为在优化方面你能做的最好的事情就是附加一个事件来监听一组元素并将参考值存储到data-attr。

你的html元素看起来像这样：

<div class='Sous-Menu' data-groupe='Sous-Menu-7'></div>

你的js看起来像这样：

// note if you are using a ref twice
// make sure you cach it into a var 
// so jquery does not have to parse the dom
// twice to search for the same thing
var $sousMenu = $('.Sous-Menu');

$sousMenu.mouseover(function() {
  var $this = $(this); // get element ref
  var groupe = $this.data('groupe'); // get the group attr from the el

  $sousMenu.hide(); 

  // your code here ... if (groupe == 'Sous...')
});

您的js将改善其性能，减少事件数量并防止jquery从非必要的dom横向移动。

关于你的php的快速说明，请确保使用PDO而不是mysql_query，因为它不再支持，并且将来不再使用它。

希望它解决你的问题，欢呼！

如何优化这个PHP / JS代码

1 个答案: