Cant preventDefault() on jQTouch link

StackOverflow https://stackoverflow.com/questions/9010873

سؤال

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