AJAX上的页面重新加载失去了对按钮的关注

时间:2014-10-24 03:44:33

标签: javascript html ajax

我有一个按钮单击操作,我在其上进行AJAX调用以更新字段。 AJAx回归后,我这样做 -

     document.location.reload(true);

页面重新加载,但焦点不会返回到按钮。您能否建议我可以重新加载/刷新页面的方法,然后重点返回按钮再次单击?

我在这里更新了我的AJAX代码,请告诉我如何修改它 -

<input type="button" name="IncreaseMyDate" id="myDate"  value="Increase" onclick="updateMyDate('<%=myDate%>')"/>


     function updateMyDate(mywDate)
{
    XMLHttpObj_myDate = CreateHttpObject();

    if(XMLHttpObj_myDate == null){
        alert("HTTP Request not supported");
        return;
    }

     var itemId = document.getElementById("itemId").value;   

    document.getElementById("myDate").setAttribute("disabled",true) ;
    var url ="IncreaseMyDate.jsp?action=update&myDate="+reviewDate; 

    document.getElementById("myDate").style.cursor = "not-allowed"; 
    XMLHttpObj_myDate.onreadystatechange=fillMyDate;
    XMLHttpObj_myDate.open("GET",url);
    XMLHttpObj_myDate.send(null);

    return false;

}



function fillMyDate(){
    if(XMLHttpObj_reviewDate.readyState == 4 || XMLHttpObj_myDate.readyState == "complete"){
        document.getElementById("myDate").style.cursor = "pointer"; 
        document.getElementById(myDate").innerHTML = XMLHttpObj_myDate.responseText; 

     document.location.reload(true);
    }       
}

2 个答案:

答案 0 :(得分:0)

为什么要重新加载页面?进行Ajax调用的最大好处是它们无需重新加载页面。您可以在重新加载页面时执行所有Ajax工作服务器端。

您需要将一个变量传递给新的页面加载,指示哪个按钮应该具有焦点。您的页面重新加载不知道客户端之前发生了什么。在查询字符串中传递按钮的ID,然后使用它再次查找按钮并设置焦点。

答案 1 :(得分:0)

您可以将按钮的ID存储在sessionStorage中,然后检查页面何时加载以重新应用焦点(如果适用)。

以下页面在我的测试中有效:

<body onload="body_onload();">
<button id="buttonA" onclick="button_click(this);">Button A</button><br/>
<button id="buttonB" onclick="button_click(this);">Button B</button><br/>
<button id="buttonC" onclick="button_click(this);">Button C</button><br/>
</body>

<script>
    function body_onload() {
        var buttonId = sessionStorage["buttonId"];
        if (buttonId) {
            document.getElementById(buttonId).focus();
        }
    }
    function button_click(button) {
        sessionStorage["buttonId"] = button.id;
        document.location.reload(true);
    }
</script>