HTML页面加载时间过长，页面无响应

Question

My web page is taking too much time to load. reason is that page have a HTML table which has around 3000 columns and every column has a text box within it. Is there a way so that I can reduce the loading time or suggest if there is any other alternative.

thanks in advance

EDIT - Ok let me tell you the exact senerio, my table needs to show the date wise data and the Date (like 14-Dec-2012) will be the column header itself. the latest date will be the first column, then the past dates will comes across, some thing like (14-Dec-2012|13-Dec-2012|12-Dec-2012.....) every day when system date changes a new column would be added as the first column. There are around 200 rows. Its an JSP page and in a for loop I am creating the table header first, then in second for loop creating the table cells containing the values in textbox (so that user can edit them anytime).

code sample - Header -

<%
    Date today = new Date();
    String col = "";
    today = RDUtils.addDays(today, 1);
for(int i=0;i<=columnCount;i++){
    today = RDUtils.addDays(today, -1);
    col = RDUtils.getStringDateCol(today);
%>
<th class="TableHeader"><div><%=col%></div></th>
<%} %>

Table cells -

for(int j=0;j<=columnCount;j++){%>
    <input maxlength="5" onblur="fillZero(this);" onFocus='clearField(this);' onkeypress="if (checkEnter())return false;" onkeyup='if (checkEnter()) move("<%=i %>");' size="5" type="text" name="txtEntry<%=de.getId()%>" value="<%=val%>" id="<%=de.getId()%>"/></div> </td>

JS functions -

function checkEnter(e){
    characterCode = e.keyCode;
    return characterCode == 13;
}
function fillZero(obj){
if(obj.value==''){
    obj.value = 0;
}
 }
 function clearField(obj){
var perfix = obj.name.substring(8, obj.name.length);
var chkObj = document.getElementById('deCheck'+perfix);
if(!chkObj.checked)chkObj.checked=true;
if(obj.value==0){
    obj.value = '';
}
 }

Answer 1

It is better to use pagination using Datatables .

And use the AJAX method.

$(document).ready(function() {
    $('#example').dataTable( {
        "bProcessing": true,
        "sAjaxSource": '../ajax/sources/arrays.txt'
    } );
} );