Categories
discuss

What is the life span of an ajax call?

let’s say I have this code in javascript:

function doAnAjaxCall () {
    var xhr1 = new XMLHttpRequest();
    xhr1.open('GET', '/mylink', true);
    xhr1.onreadystatechange = function() {
        if (this.readyState == 4 && this.status==200) {
            alert("Hey! I got a response!");
        }
    };
    xhr1.send(null);
}

and let the code in the servlet be:

public class RootServlet extends HttpServlet {
    public void doGet (HttpServletRequest req, HttpServletResponse resp) throws IOException {
        resp.getWriter().write("What's up doc?");
        resp.setStatus(200);
    }
}

Will xhr1 still wait for new changes in readystate? Or it is closed as soon as it gets the first response? If it remains open, will it lead to memory leaks/slower browser after a while and accumulating a few of those? Should I always call resp.getWriter().close() at the end of the servlet code?

And, lastly, for the jQuery fans out there:

does $.ajax() behave as XMLHttpRequest() in that respect?

Answer

Will xhr1 still wait for new changes in readystate? Or it is closed as soon as it gets the first response? If it remains open, will it lead to memory leaks/slower browser after a while and accumulating a few of those?

Behind the scenes, it remains open. It (and the memory occupation) is however the responsibility of the webbrowser engine. It maintains a certain amount of connections in a pool which has a maximum limit per domain anyway. MSIE for example has a bug which causes them to leak away when they are still running while the user unloads (closes) the window.

Should I always call resp.getWriter().close() at the end of the servlet code?

Not necessary. The servletcontainer will close it anyway. Closing it yourself only prevents the risk of some (buggy) code further in the response chain from writing to the response body. For more detail, see this answer.

And, lastly, for the jQuery fans out there: does $.ajax() behave as XMLHttpRequest() in that respect?

It uses XMLHttpRequest under the covers (only when supported by the browser; otherwise it’s the MSIE ActiveX object). It constructs a new one on every call. Open the unminified source code, Ctrl+F the jQuery.ajaxTransport( function. All the ajax handling code is almost 200 loc and it covers all possible browser specific bug fixes you can think about.

Categories
discuss

iOS automatic hover fix?

Is there a jQuery plugin or JavaScript script that automagically loops through each CSS hover (found in an external stylesheet) and binds it with a double touchdown event?

  • Touchdown 1 – CSS :hover is triggered
  • Touchdown 2 – Click (link following or form action)

If there isn’t something like this yet, can it be made and how (guidelines)?

EDIT:

To be clear, I am not in search of a double tap. Touchdown 1 is a single tab just like Touchdown 2 is. There can be as less as 0 seconds between both or as much as 3 minutes, that’s the user’s choice.

No touch:

  • :hover -> element becomes visible
  • click -> following link or other action

Touch (iOS):

  • touchdown 1 -> element becomes visible
  • touchdown 2 -> following link or other action

Answer

Try this:

<!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>
    <title>iPad Experiment</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            if(navigator.platform == "iPad") {
                $("a").each(function() { // have to use an `each` here - either a jQuery `each` or a `for(...)` loop
                    var onClick; // this will be a function
                    var firstClick = function() {
                        onClick = secondClick;
                        return false;
                    };
                    var secondClick = function() {
                        onClick = firstClick;
                        return true;
                    };
                    onClick = firstClick;
                    $(this).click(function() {
                        return onClick();
                    });
                });
            }
        });
    </script>
    <style type="text/css">
        a:hover {
            color:white;
            background:#FF00FF;
        }
    </style>
<body>
    <a href="http://google.ca">Google</a>
    <a href="http://stackoverflow.com">stackoverflow.com</a>
</body>
</html>

… or check out the demo on my web site. Note that it’s set up to only work its magic on the iPad – detecting all versions of the iOS is another question in my books 😉

It works on the basis of the fact that…

After you click a link on the iphone or ipad, it leaves a simulated mouse hover that triggers the a:hover css styling on that link. If the link has a javascript handler that keeps you on same page, the hover state will not change until you click on another link.

Citation: Safari iphone/ipad “mouse hover” on new link after prior one is replaced with javascript

Source: stackoverflow
Text is available under the Creative Commons Attribution-ShareAlike License; additional terms may apply. By using this site, you agree to the Privacy Policy, and Copyright Policy. Content is available under CC BY-SA 3.0 unless otherwise noted. The answers/resolutions are collected from stackoverflow, are licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0 © No Copyrights, All Questions are retrived from public domain..