Question

脚本

$(document).ready(function() {
    $("#ulSub").append('<li id="abc hover" class="DJ hover"><h5>Cancer information</h5><ul id="ulSub1 fadeIn/fadeOut">');
    var ciid = $("#ulSub li").find("ul");
    $(ciid).append('<li><h5>What is cancer</h5></li></ul></li>');
});

HTML

<div class="dmenu">
    <ul id="ulSub">
    </ul>
</div>

Answer 1

要实现此目的，请适当使用jQuery的.mouseover()和.mouseout()函数。

下面的工作和直观代码：

$(document).ready(function() {
  $("#ulSub").append('<li id="abc hover" class="DJ hover"><h5>Cancer information</h5><ul id="ulSub1 fadeIn/fadeOut">');
  var ciid = $("#ulSub li").find("ul");
  $(ciid).append('<li><h5>What is cancer</h5></li></ul></li>');

  if($("li").hasClass("DJ"))
    $("li").removeClass("DJ");

  $("li").mouseover(function(e) {
    $(this).addClass("DJ");
    e.stopPropagation();
  }).mouseout(function(e) {
    $(this).removeClass("DJ");
  });

});

.DJ{
  background: yellow;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="dmenu">
  <ul id="ulSub">
  </ul>
</div>

<小时/> 阅读：

通过jquery动态加载菜单和子菜单的代码

1 个答案: