Мобильные правила jQuery не применяются - PullRequest
0 голосов
/ 13 мая 2011

Это мой файл index.jsp, но jQuery mobile CSS и JS не выполняют свою работу.

enter image description here

Мои файлы .css и .js находятся на том же уровне каталогов, что и index.jsp. Должны ли они быть в другом каталоге? Вот моя структура каталогов

enter image description here

Вот мой index.jsp:

<html>
    <head>
        <link rel="stylesheet" type="text/css" href="jquery.mobile-1.0a4.1.css" />
        <script type="text/javascript" src="jquery.mobile-1.0a4.1.js"></script>
    </head>
    <body>
        <div data-role="fieldcontain">
            <label for="slider">Input slider:</label>
            <input type="range" name="slider" id="slider" value="0" min="0" max="100"  />
        </div>
    </body>
</html>

Firebug говорит, что оба ресурса загружены

enter image description here

Ответы [ 5 ]

2 голосов
/ 13 мая 2011

Вам нужно добавить тег data-role = "page" вокруг содержимого, а также добавить фреймворк jQuery

<html>
    <head>
        <link rel="stylesheet" type="text/css" href="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.css" />
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.min.js"></script>
        <script type="text/javascript" src="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js"></script>
    </head>
    <body>
        <div data-role="page">
            <div data-role="fieldcontain">
                <label for="slider">Input slider:</label>
                <input type="range" name="slider" id="slider" value="0" min="0" max="100"  />
            </div>
        </div>
    </body>
</html>
1 голос
/ 13 мая 2011

Для jQuery mobile требуется также jQuery для загрузки. Загрузите его, поместите в ту же папку и добавьте следующую строку перед загрузкой jQuery mobile.

<script type="text/javascript" src="jquery.js"></script>
1 голос
/ 13 мая 2011

Ваша страница далека от структуры справочной страницы, как показано здесь .

Вы должны иметь следующую обертку вашего поля-содержимого после вашего тела:

<div data-role="page">
... your content in the body
</div>
0 голосов
/ 23 марта 2012

при использовании jquery-mobile с jsp необходимо убедиться, что вы используете путь cdn

    <link rel="stylesheet" type="text/css" href="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.css" />
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.min.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js"></script>
0 голосов
/ 13 мая 2011

ммм, вам нужно включить их в заголовок файла:

    <link rel="stylesheet" type="text/css" href="something.css" />
<script type='text/javascript' src='something.js'></script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...