0

I really didn't know how to explain my question in the title, so I tried.

Anyways, this is my problem. I have a webpage which is basically a puzzle. The basic premise of it is that when you visit a certain link, it will trigger a function and show the next piece.

Here's one of the functions that will show the piece -

function showone() {
        var elem = document.getElementById("one");
         if (elem.className = "hide") {
            elem.className = "show"
            }
}       

The reason that it's built like this, is because the pieces are constructed and placed using an HTML table, using classes to hide and show them.

What I need to do, is somehow create a URL that will trigger a new piece. For example, "www.website.com/index.html?showone" is what I'd like. This would trigger the "showone" function.

I don't know how to do this though, and after a fair bit of searching, I'm more confused than I was to begin with.

The reason I'm using JavaScript to begin with, is that the page can't refresh. I understand that this might not be possible, in which case, I'm open to any suggestions on how I could get this to work.

Thanks in advance, any suggestions would be greatly appreciated.

-Mitchyl

5
  • 1
    you are looking for window url hashes and hashChange events Commented Aug 13, 2014 at 16:42
  • 1
    Why do they need to visit a different URL? I assume they have to click on something? Why not use click events? Commented Aug 13, 2014 at 16:45
  • @Prasanth Thanks! Do you know how to could implement this specific feature using those methods though? After a quick look, I think it'll take me a long while to learn the basics(which I'll definitely do), but I need to get this done before I can take the time to learn another subject, haha. Commented Aug 13, 2014 at 16:45
  • @Cheruvian They can't click on anything. They "find" URLs, which lead them back to the main page where pieces appear until they're all uncovered. There aren't any buttons on the webpage. Commented Aug 13, 2014 at 16:46
  • @Mitchyl click events can bind to more than just buttons. Although I'm still unsure of how your game works, click events seem to be the easiest solution here. Commented Aug 13, 2014 at 16:56

2 Answers 2

2

Javascript web application frameworks can to this for you, they allow to build web application without refresh page.
For example you can use backbonejs it has Router class inside and it very easy to use. code is easy as :

var Workspace = Backbone.Router.extend({

  routes: {
    "help":                 "help",    // #help
    "search/:query":        "search",  // #search/kiwis
    "search/:query/p:page": "search"   // #search/kiwis/p7
  },

  help: function() {
    ...
  },

  search: function(query, page) {
    ...
  }

});

is also you can use angularjs it is big one that supports by Google.

Sign up to request clarification or add additional context in comments.

1 Comment

Whoa! This makes everything very, very easy. I was actually looking at backbone.js a few weeks ago for another project, it looks very cool. Thanks!
0

Maybe this solution can help you?

$("a.icon-loading-link").click(function(e){
    var link = $(e.target).prop("href"); //save link of current <a> into variable

    /* Creating new icon-tag, for example $("<img/>", {src: "link/to/file"}).appendTo("next/dt"); */

    e.preventDefault(); //Cancel opening link
    return false;       //For WebKit browsers
});

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.