Javascript 如何在单击span时打开子菜单？

下面是我正在使用的两个脚本

第一个在

.a

后添加箭头，该

具有
子菜单
，
具有子菜单

jQuery(function($) {
  $('a + ul').prev('a').append('<span class="sub-menu-open">&#9660</span>');
});

这是html代码

<ul id="menu-izb" class="menu">
  <li id="menu-item" class="bp-menu ">
    <a href="/">Activity</a>
  </li>
  <li id="menu-item" class="bp-menu">
    <a href="/">Log Out</a>
  </li>
  <li id="menu-item" class="menu-item"><a href="/">Blog
    <span class="sub-menu-open">▼</span>
    </a>
    <ul class="sub-menu" style="">
    ...








...

单击
▼？
我不知道你的JS代码在做什么。但这里有一个“点击span打开子菜单”的解决方案：









布拉1


废话


喋喋不休




jQuery（函数（$）{
$（'.sub-menu'）.hide（）；
$（“.子菜单打开”）.parent（）.单击（函数（e）{
e、 预防默认值（）；
$（this.parent（）.find（“.sub-menu”）.toggle（）；
});
});

这是一把小提琴：
谢谢。不幸的是，在我的例子中，span就在里面，我正在寻找一个解决方案，让span忽略一个链接，然后按照jsfiddle.ah中的方法来做。好吧，但这没有任何意义。如果您不需要链接，那么只需删除周围的锚标记。为什么你不能这样做？我已经更新了答案和小提琴中的代码。现在它与锚定标记一起工作。
<ul id="menu-izb" class="menu">
  <li id="menu-item" class="bp-menu ">
    <a href="/">Activity</a>
  </li>
  <li id="menu-item" class="bp-menu">
    <a href="/">Log Out</a>
  </li>
  <li id="menu-item" class="menu-item"><a href="/">Blog
    <span class="sub-menu-open">▼</span>
    </a>
    <ul class="sub-menu" style="">
    ...

<ul id="menu-izb" class="menu">
  <li id="menu-item" class="bp-menu ">
    <a href="/">Activity</a>
  </li>
  <li id="menu-item" class="bp-menu">
    <a href="/">Log Out</a>
  </li>
  <li id="menu-item" class="menu-item has-children"><a href="">Blog
  <span class="sub-menu-open">▼</span></a>
    <ul class="sub-menu" style="">
      <li id="menu-item" class="menu-item">
         Bla1
      </li>
      <li id="menu-item" class="menu-item">
         Bla2
      </li>
      <li id="menu-item" class="menu-item">
         Bla3
      </li>
    </ul>
  </li>
</ul>




 <script>
jQuery(function($) {
  $('.sub-menu').hide(); 
  $('.sub-menu-open').parent().click(function(e){
                e.preventDefault();
        $(this).parent().find(".sub-menu").toggle();
    });
});
</script>