如何在jsp文件的span标记上从JavaScript渲染html代码?

时间:2015-02-23 19:56:09

标签: javascript html css jsp

我正在处理一个jsp文件,它有一个span标记,如下所示:

<span id="divBasicSearchResults" style="height:100%;"></span>

在此范围内呈现html代码的Javascript文件如下所示:

function renderBasicSearchNarrative1(response) {
var html = '';
var i = 0;
var j = 0;

if(response){
    html += '<table><tr><th colspan="5">Search Results</th></tr>';
    html += '<tr><td><b>#</b></td><td style="min-width:150px;"><b>Name</b></td><td><b>Lat/Long</b></td></tr>';
    html += '<tbody>';

    for(var i =0; i < response.length; i++){
        var result = response[i];
        var resultNum = i+1;            
        if(result.lat>47.33 && result.lat<48.92 && result.lon>9.8 && result.lon<13.46){ //this loop is to restrict the results to Munich
        html += "<tr valign=\"top\">";
        html += "<td>" + resultNum + "</td>";

        html += "<td>";
        if(result.display_name){
            var new_display_name = result.display_name.replace(/,/g, ",<br />");
            html += new_display_name;               
        }
        html += "</td>";

        html += "<td>" + result.lat + ", " + result.lon + "</td>";
        addmarker(result.lat, result.lon, "map-pointer-icon.png");

        html += "</tr>";
    } //end of for loop for Munich
}
    html += '</tbody></table>';
}

document.getElementById('divBasicSearchResults').style.display = "";
document.getElementById('divBasicSearchResults').innerHTML = html;

现在,在上面的代码中,我正在动态生成一个html代码,该代码应该在jsp文件中呈现。但是我面临的问题是我无法看到动态生成的整个html代码,而只是在我的span标签上看到html代码的标题数据。我在span标签上看到的结果是:

Search Results
#Name   Lat/Long

提前感谢您阅读本文,等待建议。

2 个答案:

答案 0 :(得分:1)

我认为你的问题是你跨度的高度。您需要检查span父元素的css设置。例如他们有一个固定的高度和溢出:隐藏在他们身上。这意味着你的html在你的范围内完美呈现,但是因为没有足够的空间而没有被看到。

另外,正如埃里克指出的那样,将一张桌子放在一个跨度内是不正确的标记。你应该使用div。

答案 1 :(得分:0)

我建议SPAN标记不适合渲染整个表:更好地使用DIV