OnClick事件在移动浏览器中不起作用 [英] OnClick event is not working in mobile browser

查看:161
本文介绍了OnClick事件在移动浏览器中不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个html页面,我在div标签中添加了onclick事件。在那个onclick事件中,我使用了location.href = url来打开任何url。
它在网络浏览器中工作正常,但不适用于移动浏览器。
这是什么原因?
我的代码是 -

I have a html page in which i have added onclick event in div tag. In that onclick event i have used location.href = url to open any url. It is working fine in web browser but is not working in mobile browser. What is the reason for this ? My Code is -

<html class="swipebox-html swipebox-touch">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
<link rel="stylesheet" href="../css/swipebox.css">
<script src="../js/jquery-2.1.0.min.js"></script>
<script src="../js/jquery.swipebox.js"></script>
<script type="text/javascript">
    jQuery(function($) {
        window.onload = function(e) {
            e.preventDefault();
            $.swipebox([ {
                href : '../img/sari1.jpg'
            }, {
                href : '../img/sari2.jpg'
            }, {
                href : '../img/sari3.jpg'
            }, {
                href : '../img/sari4.jpg'
            } ]);
            $(".slide")
                    .attr(
                            "onclick",
                            "document.location.href='http://www.amazon.in/s/ref=nb_sb_noss_2?url=search-alias%3Daps&field-keywords=saris+&rh=i%3Aaps%2Ck%3Asaris+'");
        }
    });
</script>
</head>
<body class="touching">
    <div id="swipebox-overlay" style="width: 360px; height: 640px;"
        class="">
        <div id="swipebox-container">
            <div id="swipebox-slider"
                style="display: block; transition: transform 0.4s ease; -webkit-transition: transform 0.4s ease; -webkit-transform: translate3d(0%, 0px, 0px); transform: translate3d(0%, 0px, 0px);">
                <div class="slide current"
                    onclick="document.location.href='http://www.amazon.in/s/ref=nb_sb_noss_2?url=search-alias%3Daps&amp;field-keywords=saris+&amp;rh=i%3Aaps%2Ck%3Asaris+'">
                    <img src="../img/sari1.jpg">
                </div>
                <div class="slide"
                    onclick="document.location.href='http://www.amazon.in/s/ref=nb_sb_noss_2?url=search-alias%3Daps&amp;field-keywords=saris+&amp;rh=i%3Aaps%2Ck%3Asaris+'">
                    <img src="../img/sari2.jpg">
                </div>
                <div class="slide"
                    onclick="document.location.href='http://www.amazon.in/s/ref=nb_sb_noss_2?url=search-alias%3Daps&amp;field-keywords=saris+&amp;rh=i%3Aaps%2Ck%3Asaris+'"></div>
                <div class="slide"
                    onclick="document.location.href='http://www.amazon.in/s/ref=nb_sb_noss_2?url=search-alias%3Daps&amp;field-keywords=saris+&amp;rh=i%3Aaps%2Ck%3Asaris+'"></div>
            </div>
            <a id="swipebox-close"
                style="background-image: url(file:///C:/Users/AmitDas/OBDWorkspace/mobileCatalogue/src/frontend/web/img/icons.svg);"></a>
        </div>
    </div>
</body>
</html>


推荐答案

对于移动浏览器,我们可以使用touchstart事件没有点击。
由此我解决了我的问题。

For mobile browser we can use touchstart event with click instead of no click. And By this i resolved my issue.

这篇关于OnClick事件在移动浏览器中不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆