페이지 새로 고침 후 자동 Ajax 호출

동적으로 데이터를 생성하는 Ajax를 사용하는 웹 페이지가 있지만 사용자가 페이지를 새로 고치면 사라지지만 드롭 다운 메뉴에는 여전히 선택 항목이 있습니다. 어쨌든 동적으로 생성 된 데이터를 유지하거나 Ajax 호출을 다시 제출할 수 있습니까?페이지 새로 고침 후 자동 Ajax 호출

index.html을 :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=utf-8" /> 
    <meta http-equiv="content-language" content="zh-HK" /> 
    <script type="text/javascript" src="includes/js/paginator.js"></script> 
    <script type="text/javascript" src="includes/js/scripts.js"></script> 
    <link rel="stylesheet" href="includes/css/styles.css"></link> 
    <title>Course Search</title> 
</head> 
<body> 
    <form id="show_course"> 
     <table id="search"> 
      <tr> 
       <th class="reset"> 
        <label><a href="#" name="session" onclick="showCourse(this.value, 'destroy');document.getElementById('show_course').reset();"><img src="images/reset.gif" alt=""/></a></label> 
       </th> 
       <th class="subject"> 
        <select name="subject" onchange="showCourse(this.value, 'Subject');disableEnableForm(document.getElementById('show_course'), false);"> 
         <option selected="selected" value=""></option> 
         <option value="Math">Math</option> 
         <option value="Math%20-%20M2">Math - M2</option> 
         <option value="Maths%20%26%20Statistics (A)">Maths &amp; Statistics (A)</option> 
         <option value="Math Core">Math Core</option> 
        </select> 
       </th> 
       <th class="tutor"> 
        <select name="tutor" onchange="showCourse(this.value, 'Tutor');disableEnableForm(document.getElementById('show_course'), false);"> 
         <option selected="selected" value=""></option> 
         <option value="Math">Math</option> 
        </select> 
       </th> 
       <th class="level"> 
        <select name="level" onchange="showCourse(this.value, 'Level');disableEnableForm(document.getElementById('show_course'), false);"> 
         <option selected="selected" value=""></option> 
         <option value="P1">P1 - Primary 1</option> 
        </select> 
       </th> 
       <th class="type"> 
        <select name="type" onchange="showCourse(this.value, 'Type');disableEnableForm(document.getElementById('show_course'), false);"> 
         <option selected="selected" value=""></option> 
         <option value="Regular">Regular</option> 
         <option value="Intensive">Intensive</option> 
        </select> 
       </th> 
       <th class="centre"> 
        <select name="centre" onchange="showCourse(this.value, 'Centre');disableEnableForm(document.getElementById('show_course'), false);"> 
         <option selected="selected" value=""></option> 
         <option value="1">紅磡 - Hung Hom</option>   
        </select> 
       </th> 
      </tr> 
     </table> 
    </form> 
    <div id="dynamic_display"></div> 
</body> 
</html>

scripts.js :

function openTimetable() 
{ 
    timetableWindow=window.open('timetable.php','timetable','status=no,left='+(screen.availWidth/2-200)+',top='+(screen.availHeight/2-200)+',height=400,width=400,scrollbars=yes'); 
    timetableWindow.focus() 
} 

function disableEnableForm(form, boolean) 
{ 
    var formElements = form.elements; 

    for (i = 0; i < form.length; i ++) { 
     formElements[i].disabled = boolean; 
    } 
} 

function showCourse(search, key) 
{ 
    if (search == "") { 
     document.getElementById("dynamic_display").innerHTML = ""; 
     return; 
    } 

    if (window.XMLHttpRequest) { 
     xmlhttp = new XMLHttpRequest(); 
    } else { 
     xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 

    xmlhttp.onreadystatechange = function() 
    { 
     if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
      document.getElementById("dynamic_display").innerHTML = xmlhttp.responseText; 
      pager = new Pager('results', 15); 
      pager.init(); 
      pager.showPageNav('pager', 'pager_display'); 
      pager.showPage(1); 
     } 
    } 

    xmlhttp.open("GET", "search.php?key=" + key + "&search=" + search, true); 
    xmlhttp.send(); 
}

출처

2010-12-29 Anonymous

주어진 시간에 변경됩니다,이 시도 :

window.onload=function() { 
    var selects = document.getElementsByTagname('select'); 
    for (var i=0;i<selects.length;i++) { 
    if (selects[i].selectedIndex>0) { // something was selected 
     selects[i].onchange(); 
     break; 
    } 
    } 
}

출처

2010-12-29 09:15:06 mplungjan

나는 페이지 새로 고침 사이에 데이터를 유지하는 방법을 몰라,하지만 난 당신이 호출 할 수 있습니다 창로드 이벤트를 사용하여 생각 모든 JavaScript 함수. 여기에 예제가있다 link text

하지만 전체 페이지가로드 될 때 window.onload가 실행되므로 페이지가 큰 경우 window.onDomReady를 고려해야합니다. 단지 선택의 ONE 가정 Example이

출처

2010-12-29 08:27:41 vmg

페이지 새로 고침 후 자동 Ajax 호출

답변

관련 문제