页面加载时是否可以触发触摸事件(In onload功能)?

时间:2013-11-12 13:02:20

标签: javascript jquery html5 onload

我没有得到如何在页面加载时调用触摸事件。 我尝试使用下面的代码,但事件没有触发。谁能告诉我我哪里做错了?

$(window).onload = setTimeout(function () {
    document.getElementById('resetBtn').style.display = 'none';
    $('#splash').attr('src', 'img/splash.png');
    disableZoomButtons();
    setTimeout(function () {
        $("#splashDiv").remove();
        $('#menuBg').attr('src', 'img/wood.png');
        $('#about').attr('src', 'img/about1.png');
        $('#help').attr('src', 'img/help1.png');
        $('#newGame').attr('src', 'img/newgame.png');

        $('#newGame').on('touchstart', function (e) {
            alert("Start");
            enableZoomButtons();
            can = document.getElementById('can');
            cxt = can.getContext('2d');
            init();
        });
    });
}, 2000);

这是HTML代码

<body>

<img id="background" />
<div id="splashDiv">
    <img id="splash" src="img/splash.png"
        style="width: 100%; height: 100%; z-index: 1; position: absolute;" />
</div>
<div id="menuBgDiv">
    <img id="menuBg" src="img/wood.png"
        style="width: 100%; height: 100%; z-index: -1; position: fixed;" />
<ul>
    <li><img class="menus" id="newGame" src="img/newgame.png" />
    </li>
    <li><img class="menus" id="help" src="img/help1.png" />
    </li>
    <li><img class="menus" id="about" src="img/about1.png" />
    </li>
</ul>
</div>
</body>

是否可以在onload函数中调用触摸事件(NOT触发器)

newGame id是HTML中定义的图像ID。我需要点击newGame图像按钮,然后init()方法必须调用。

2 个答案:

答案 0 :(得分:1)

尝试此操作以触发事件:

$('#newGame').on('touchstart', function (e) {
    alert("Start");
    enableZoomButtons();
    can = document.getElementById('can');
    cxt = can.getContext('2d');
    init();
})
.trigger("touchstart");

答案 1 :(得分:0)

而不是

$(window).onload

使用

$(document).ready( function() {} );

可能的问题是,即使在加载实际元素之前,您也要附加事件。还有什么是setTimeout的用途?我不太清楚。只需使用上面的代码并删除setTimeout。

$(document).ready( function() {
    document.getElementById('resetBtn').style.display = 'none';
    setTimeout(function () {
        $('#splash').attr('src', 'img/splash.png');
        $("#splashDiv").remove();
        $('#menuBg').attr('src', 'img/wood.png');
        $('#about').attr('src', 'img/about1.png');
        $('#help').attr('src', 'img/help1.png');
        $('#newGame').attr('src', 'img/newgame.png');
        $('#newGame').click( function (e) {
            alert("Start");
            can = document.getElementById('can');
            cxt = can.getContext('2d');
        });
    }, 2000);
});

已编辑:我删除了不必要的功能但您可以重新添加