如何使用javascript在jsp页面中动态添加内容？答案

【问题标题】：How to dynamically add the content in jsp page using javascript?如何使用javascript在jsp页面中动态添加内容？
【发布时间】：2014-01-30 14:30:31
【问题描述】：

MyServlet 作为

转发到 Mypage.jsp

request.getRequestDispatcher("/pages_homepage.jsp?value="+count).forward(request, response);

其中 count 是生成的整数值

下面是我的 JSP 代码（Mypage.jsp），

<body  onload="getPage('<%request.getParameter("value");%>')">
    <div id="app"></div>
</body>

下面是我的javascript代码，

function getPage(match){
    var arr = new Array();
    var ele = document.getElementById('app');
    for(var i=0;i<match;i++){
        var newdiv = document.createElement("label");
        newdiv.id = arr[i];
        newdiv.value="Page";
        ele.appendChild(newdiv);
    }
}

我想要的是，我希望“页面”显示“匹配”次数。但我无法通过上面的代码做到这一点。他们的 js 代码可能有问题。任何人都可以建议我进行任何更正吗？提前致谢。

【问题讨论】：

arr 是什么？它应该包含什么？有趣的是您的命名法，您命名了一个 var newdiv，它实际上是一个 <LABEL> 元素，并且您尝试将 value 属性添加到 label 元素和空数组中的 ID ......可以请教一下吗？
@RokoC.Buljan 我试图给 newdiv 一个唯一的 id，但我知道我写了一个混乱的代码。你能推荐什么吗？
你的意思是：stackoverflow.com/questions/10126395/… ?
<%request.getParameter("value");%>返回了什么？您能否预先提出您的问题，并更清楚地说明您真正想要什么？
@RokoC.Buljan 这会返回一个数字。

标签： javascript jquery jsp

【解决方案1】：

LIVE DEMO

考虑到您的页面具有以下内容：

<body  onload="getPage(5)">

function getPage(n) {

   var ele = $('#app');
   var labels = ""; // An empty string will be populated with labels elements:
   for(var i=0; i<n; i++){
       labels += '<label id="'+ i +'"> Page </label>'
   }
   ele.append( labels ); // append only once outside the loop!

}

结果将是：

 <label id="0"></label>
 <label id="1"></label>
 <label id="2"></label>
 <label id="3"></label>
 <label id="4"></label>

如果你想从1 开始而不是0 使用：

labels += '<label id="'+ (i+1) +'"> Page </label>'

_{注意：ID 以（/仅包含）数字开头 - 仅在 HTML5 中有效}

【讨论】：

是的，您的演示工作得非常好，但唯一的事情是我想动态地向函数“getPage(num)”发送一个值。我已经更新了我的问题
ID 应该以 HTML 中的字母开头。可能应该在数字上添加一个前缀。
@TiiJ7 我正要写那个以数字开头的ID并且只包含一个数字是完全有效在 HTML5 中。
@RokoC.Buljan 我查了一下，你是对的。那是我的错 :) Ref: dev.w3.org/html5/markup/datatypes.html#common.data.id
@SaumilSoni 你想动态发送一个值......你没有在你的问题中说明（或者我不理解 JSP）但是你向我们展示了你使用了一个身体 onload 处理程序...比不使用 onload :)

【解决方案2】：

您的代码正在运行，我已经对其进行了测试

由于标签标签中没有任何内容，因此在浏览器中不可见

其次是一个小错误在第 6 行 js 代码中

       newdiv.id = arr[i];

arr[i] 没有被赋予任何值，因此将其更改为

        newdiv.id = i;

享受你的代码

【讨论】：

这已经在 OP 的 Q cmets 部分讨论过 :)

【解决方案3】：

感谢大家的帮助，但我想我得到了答案，

代替

<body  onload="getPage('<%request.getParameter("value");%>')">

我写的，

<body onload="getPage('<%=Integer.parseInt(request.getParameter("value"))%>')">

但再次感谢大家的有用指点。

【讨论】：