Question

我的反应应用中有此功能（该功能位于.html文件内）：

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
          $('.dropdown-submenu a.dropdown-submenu__templates').on("click", function(e){
            $(this).next('ul').toggle();
            e.stopPropagation();
            e.preventDefault();
          });
        });
    </script>

该功能仅在点击时显示子下拉列表。这样做的问题是，当我第一次登录进入我的应用程序并点击子下拉列表时，它只会关闭父下拉列表（并且子下拉列表根本不会出现）。

我必须刷新页面才能执行该功能。

为什么会这样？这有什么解决方案吗？

在我的 render() 函数中：

<li className="dropdown">
    <a
        className="btn btn-default dropdown-toggle"
        type="button"
        data-toggle="dropdown"
    >
      <span className="fa fa-files-o"></span>
         Menu&nbsp;
      <span className="caret"></span>
    </a>
    <ul className="dropdown-menu">
        <li><a tabIndex="-1" href="#">Item1</a></li>
        <li><a tabIndex="-1" href="#">Item2</a></li>

        <li role="separator" className="divider"></li>
        <li className="dropdown-submenu">
            <a className="dropdown-submenu__templates" tabIndex="-1" type="button">SubDropdown <span className="caret"></span></a>
            <ul className="dropdown-menu">
                 <li><a href="#">SubItem1</a></li>
                 <li><a href="#">SubItem2</a></li>
            </ul>
        </li>
    </ul>
</li>

Jquery函数没有立即执行

0 个答案: