jQuery Mobile - keepNative - no enhancement of form elements.

by Omar X

HTML

<html>
    
    <head>
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" />
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script>
            $(document).on('mobileinit', function() {
                $.mobile.page.prototype.options.keepNative = $.mobile.page.prototype.options.keepNative + ", input.native, select.native, label.native";
            });
        </script>
        <script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
    </head>
    
    <body>
        <div data-role="page">
            <div data-role="content">
                <form>
                    <legend>Native Form</legend>
                    <input type="text" class="native" />
                    <select class="native">
                        <option>foo</option>
                        <option>bar</option>
                    </select>
                    <label for="foo" class="native">Checkbox</label>
                    <input type="checkbox" id="foo" class="native"/>
                </form>
                <hr/>
                <form>
                    <legend>jQM style</legend>
                    <input type="text" />
                    <select>
                        <option>foo</option>
                        <option>bar</option>
                    </select>
                    <label for="bar">Checkbox</label>
                    <input type="checkbox" id="bar" />
                </form>
            </div>
        </div>
    </body>

</html>