문제

I am trying to prevent a link in my jQTouch application from loading the page in the href. A very simplified version of my code is as follows

<html>
    <head>
        <script type="text/javascript" src="/jquery.js"></script>
        <link rel="stylesheet" type="text/css" href="/jqtouch/css-jqtouch.css">
        <script type="text/javascript" src="/jqtouch/jqtouch.js"></script>
        <script type="text/javascript">
            $(document).ready(function()
            {
                var jQT = $.jQTouch({});

                $('#row0 a').bind('click', function(e) 
                {
                    e.preventDefault();
                    alert('test');
                });

            });
        </script>
    </head>
    <body>
        <div id="jqt">
            <div id="row0">
                <a href="#searchResults">Search</a>
            </div>

            <div id="searchResults">
                <a href="#" class="back">Back</a>
            </div>
        </div>
    </body>
</html>

When I click the 'Search' link, the alertbox appears, but the page still loads.

Am I missing something?

도움이 되었습니까?

해결책

I just had this problem don`t bind to click you actually want to be binding to tap!

It will work in a browser but what the mobile version is actually listening for is tap and and is allowing the tap to propagate even though the click is being captured.It is worth noting to that tap works in the web browser due to some goofy code magic

The difference between tap and click is a little confusing but if you look in the source at the jqtouch-jquery.js file you will get an idea of why you need to use tap and not click (even if you are using Zepto this is relevant to see what is going on).

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top