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;
    }
}

问题描述的是解决方案，但不是如何实际实现它。此外，我试图做与原始问题完全相同的事情。谢谢！

Answer 1

你可以这样做。

<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>

它捕获所有点击事件并阻止默认行为。然后它从模板中获取内容，该模板存储在类型为“text / html”的脚本标记内，并将其注入DOM。所有浏览器都会忽略除“text / javascript”以外的任何内容的脚本标记，因此以这种方式隐藏模板内容是安全的。我在这里没有做任何动态的动态，但是如果你想这样做，你可以使用John Resig的MicroTemplate，就像他在这里描述的那样：http://ejohn.org/blog/javascript-micro-templating/。当使用像MicroTemplate之类的东西时，你需要在将模板内容注入DOM之前将模板内容与动态数据合并。

另一个很好的模板选项是jQuery的官方模板（由微软合着）：http://api.jquery.com/category/plugins/templates/

onClick处理程序语法

1 个答案: