为什么我用 append()插入代码后
标签中的东西无法显示

moonbeautiful 2018-04-02 07:13:54

<div class="content">

    <div id="menu" class="sidebar">

        <div class="sidebar-dropdown"></div>    

    </div>

</div>

<script>  

$(function(){

        var html ="<ul id='nav'>";

    		html+="<li><a href='index.jsp' class='open'><i class='icon-home'></i> 首页</a></li>";

    		html+="<c:if test='${username!=null}'>";

    		html+="<li class='has_sub'><a href='#'><i class='icon-home'></i>应用测试";

    		html+="<span class='pull-right'><i class='icon-chevron-right'></i></span>";

    		html+="</a>";

  	 	 html+="<ul>";

    		html+="<li><a href='index.jsp'>租户管理1</a></li>";

    		html+="<li><a href='index.jsp'>租户管理2</a></li>";

    		html+="</ul>";

    		html+="</li>";

    		html+="</c:if>";

    		html+="</ul>";

    	$('#menu').append(html);

});

</script>

这样运行后，点击应用测试后租户管理1和租户管理2无法下拉。
如果直接在

		<div id="menu" class="sidebar">

			<div class="sidebar-dropdown"></div>

			<ul id="nav">

				<li><a href="index.jsp" class="open"><i class="icon-home"></i>首页</a></li>

				<li class="has_sub"><a href="#"><i class="icon-home"></i>应用测试

						<span class="pull-right"><i class="icon-chevron-right"></i></span></a>

					<ul>

						<li><a href="index.jsp">租户管理1</a></li>

						<li><a href="index.jsp">租户管理2</a></li>

					</ul></li>

			</ul>

		</div>

运行的话是可以的，用了好多方法都无法实现，请问这该怎么改？

...全文

360 3 打赏收藏转发到动态举报

写回复

用AI写文章

3 条回复

切换为时间正序

请发表友善的回复…

发表回复

moonbeautiful 2018-04-02

打赏
举报

学习了，谢谢

天际的海浪 2018-04-02

打赏
举报


<!DOCTYPE html>
<html>
<head>
<title>SaaS</title>
<link href="style/bootstrap.css" rel="stylesheet">
<link rel="stylesheet" href="style/font-awesome.css">
<link href="style/style.css" rel="stylesheet">
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>  
</head>
<body>
<div class="content">
    <div id="menu" class="sidebar">
        <div class="sidebar-dropdown"></div>    
    </div>
</div>
<script>  
        var html ="<ul id='nav'>";
    		html+="<li><a href='index.jsp' class='open'><i class='icon-home'></i> 首页</a></li>";
    		<c:if test='${username!=null}'>
    		html+="<li class='has_sub'><a href='#'><i class='icon-home'></i>应用测试";
    		html+="<span class='pull-right'><i class='icon-chevron-right'></i></span>";
    		html+="</a>";
  	 		html+="<ul>";
    		html+="<li><a href='index.jsp'>租户管理</a></li>";
    		html+="<li><a href='index.jsp'>租户管理2</a></li>";
    		html+="</ul>";
    		html+="</li>";
    		</c:if>
    		html+="</ul>";
    	$('#menu').append(html);
</script> 
<script src="js/jquery.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/custom.js"></script>
</body>
</html>

moonbeautiful 2018-04-02

打赏
举报

<!DOCTYPE html>
<html>
<head>
<title>SaaS</title>
<link href="style/bootstrap.css" rel="stylesheet">
<link rel="stylesheet" href="style/font-awesome.css">
<link href="style/style.css" rel="stylesheet">
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>  
</head>
<body>
<div class="content">
    <div id="menu" class="sidebar">
        <div class="sidebar-dropdown"></div>    
    </div>
</div>
<script>  
$(function(){
        var html ="<ul id='nav'>";
    		html+="<li><a href='index.jsp' class='open'><i class='icon-home'></i> 首页</a></li>";
    		html+="<c:if test='${username!=null}'>";
    		html+="<li class='has_sub'><a href='#'><i class='icon-home'></i>应用测试";
    		html+="<span class='pull-right'><i class='icon-chevron-right'></i></span>";
    		html+="</a>";
  	 		html+="<ul>";
    		html+="<li><a href='index.jsp'>租户管理</a></li>";
    		html+="<li><a href='index.jsp'>租户管理2</a></li>";
    		html+="</ul>";
    		html+="</li>";
    		html+="</c:if>";
    		html+="</ul>";
    	$('#menu').append(html);
});
</script> 
<script src="js/jquery.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/custom.js"></script>
</body>
</html>

这个是完整代码

有兴趣刚需的可以自己下载，非常实用的jquery代码，可以完美运行，有能力的还可以二次修改！

jQuery基础知识讲的都是很容易懂的适合于初学者

jquery :empty的用法，append的用法，也就是怎样为空值标签增加内容

树形菜单栏（html），树形菜单栏（html），树形菜单栏（html）

无标题文档 <script type="text/javascript" src="script/jquery-1.8.1.min.js">

你最喜欢的水果是？

ul> <script type="text/javascript"> //这里输入替换的代码 var $li=$("ul li:eq(1)"); var li_txt=$li.text(); alert(li_txt); var $para=$("p"); var p_txt=$para.attr("title"); alert(p_txt); var $li_1=$("