jquery load和slideDown不能一起工作

时间:2015-11-25 11:44:17

标签: javascript jquery

我遇到两个功能完全独立但不能一起工作的问题。 我有一个功能来制作动态菜单,另一个功能是在div中加载页面。
当我单击菜单中的链接时,我的页面正确加载在好的div中,但似乎停止了Slide功能。所以,我没有看到我的sousmenu。

我是编码的初学者,我花了很多时间尝试解决它。我试着用$ .ajax加载,但结果是一样的。

感谢您的帮助!

//menu accordeon
jQuery().ready(function() {
  $('.menu').next('.sousmenu').hide();
  $('.menu').on('click', function() {
    if ($(this).next(".sousmenu").is(":hidden")) {
      $('.menu').next(".sousmenu:visible").slideUp();
      $(this).next(".sousmenu").slideDown();
    }
  });
  return true;

});


//loadPage
function loadPage(urlToLoad) {
  $('#page').load(urlToLoad);

};
.menu,
.menu-item {
  font-size: 0.75em;
  list-style-type: none;
  text-decoration: none;
}
.menu a {
  color: #ababab;
  font-size: 0.9em;
  text-decoration: none;
}
.menu a:hover {
  color: #757575;
  font-weight: 500;
}
.menu a.active {
  color: #757575;
  font-weight: 500;
}
.sousmenu {
  list-style-type: none;
  text-decoration: none;
  line-height: 0.6em;
}
.sousmenu:last-child {
  margin-bottom: 10px;
}
.sousmenu a {
  color: #ababab;
  font-size: 0.6em;
  list-style-type: none;
  text-decoration: none;
}
.sousmenu a:hover,
a:active {
  color: #757575;
  font-weight: 500;
}
<div id="mainmenu" class="col-2">
  <?php foreach($menu as $menuitem): ?>
  <ul class="menu">
    <a href="javascript:void(0)" onclick="loadPage('../page/<?=$menuitem['wnicename'] ;?>')">
      <?=$ menuitem[ 'name']; ?>
    </a>
  </ul>
  <ul class="sousmenu">
    <?php foreach($sousmenu as $sousmenuitem): if ($sousmenuitem[ 'id_parent']==$ menuitem[ 'id']){ echo "<li>"; echo "<a href=\"javascript:void(0)\ " onclick=\"loadPage( '"../page/" . $sousmenuitem['wnicename '] . "');\ ">"; echo $sousmenuitem[ 'name'];
    echo "</a></li>"; }?>
    <?php endforeach; ?>
  </ul>

  <?php endforeach; ?>

</div>
<!--mainmenu-->
<div id="page" class="col-12">
</div>
<!--page-->

0 个答案:

没有答案