Question

Long story short, im making a small website using ajax but its more for mobiles.

ive hijacked a few links and while testing on firebug, i get this error when clicking
links

TypeError: e.target is undefined
[Break On This Error]   

var myurl = e.target.href;

Now the thing is that although i get this error, it does work when i test it on a regular desktop and when i put on a mobile(ios) it also works and loads the AJAX content.

Reason i want to fix it is because…well aside from having an error, im having another small issue and im not sure if its because of this so, trying to fix one by one.

Heere are the two functions ive created to hijack the mobile sites links.

javascript:

//~~~~~~~~~~~~~~~~~~~~~~~~~~~functions for mobile index load AND hijacking app      

function loadPage(url){
        if( url == undefined){
            $('#contentHere').load('index.html #content', hijackLinks);
                window.location.hash = mainHash;
        } else {
            $('#contentHere').load(url + '#content', hijackLinks ); 
        }
    }


    function hijackLinks(e){
        var myurl = e.target.href;
        e.preventDefault();
        loadPage(myurl);
        mainHash = window.location.hash = $(this).attr("href");
        console.log(mainHash);

    }

Anyone can help me with this? how would i fix this?

Thanks in advanced.

Answer 1

e.target refers to the object (usually a DOM element) that originally triggered the event. If you are simply calling hijackLinks directly, rather than as an event handler, then of course e will not refer to an event and thus e.target is undefined. I’m guessing you’re also calling hijackLinks from a click handler or suchlike, therefore it will work as expected in that scenario.

You have 2 options – either change the internals of hijackLinks to not rely on being passed an event as an argument (probably not a good idea), or just change all direct calls to hijackLinks to go through a DOM element event instead. For example, your original code:

$('#contentHere').load('index.html #content', hijackLinks);

Could be changed to:

$('#contentHere').load('index.html #content', function() {
    $('a.whatever').trigger('click');
});

Change a.whatever selector to point to the actual link that is being hijacked (you haven’t shown any markup so I don’t know what that would be), then as long as you have correctly bound a click handler (or whatever UI interaction you require to trigger the event), you can rely on hijackLinks being called with an event argument.