Home/ Questions/Q 3441886
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-18T08:36:27+00:00

I am using the following code that I originally found from this question: Prevent

  • 0

I am using the following code that I originally found from this question:
Prevent offline iphone webapp from opening link in Safari

bodyOnClickHandler = function(e) {
    var target = e.target;
    if (target.tagName == 'A') {
        e.preventDefault();
        var targetUrl = target.getAttribute("href");
        window.location = targetUrl;
    }
}

The question describes the solution but not how to actually implement it. Also, I am attempting to do the exact same thing as in the original question. Thanks!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You can do something like this.

    <body>
    <a href="http://google.com">Click me</a>
    <div id="dynamic-content"></div>        
    <script id="template" type="text/html">
        <h1>Hello</h1>
        <p>This is a template</p>
    </script>
    <script>
        document.addEventListener('click', function (e) {
            var target = e.target;
            if (target.tagName == 'A') {
                e.preventDefault();
                document.getElementById('dynamic-content').innerHTML = document.getElementById('template').innerHTML;
            }
        }, false);
     </script>
</body>

    It catches all click events and prevents the default behavior. It then takes content from a template, which is stored inside a script tag with type “text/html”, and injects it into the DOM. All browsers will ignore script tags with anything other than “text/javascript”, so it’s safe to hide template content this way. I’m not doing anything dynamic with the template here, but if you wanted to do that, you can use something like John Resig’s MicroTemplate as he describes here: http://ejohn.org/blog/javascript-micro-templating/. When using something like MicroTemplate, you’ll want to merge the template content with dynamic data before injecting it into the DOM.

    Another good templating option is jQuery’s official template (co-authored by Microsoft): http://api.jquery.com/category/plugins/templates/

    • 0