Как удалить сообщение "Empty String, переданное в getElementById()" с помощью jQuery Mobile?

При использовании Firefox (23.0.1) и jQuery Mobile (1.3.2) я получаю следующее предупреждение от моего кода: Empty string passed to getElementById(). Сообщение появится в консоли (Инструменты > Веб-разработчик > Веб-консоль). Я хотел бы исключить это предупреждение.

Я видел, как многие люди задают одинаковые вопросы, в первую очередь: Лучший способ найти источник предупреждения: пустая строка передана getElementById(). Ответы, похоже, довольно последовательно указывают на использование "#", подразумевая, что пользователь неисправен.

Я попытался создать то, что, по моему мнению, является минимальным допустимым кодом, и я обнаружил, что это предупреждение все еще отображается. Я полагаю, с других сообщений, что это мой код, который виноват. Может ли кто-нибудь показать мне, как решить эту проблему?

В соответствии с комментариями других пользователей это предупреждение не появляется в Chrome (версия 29.0.1547.57)

Спасибо заранее!

Минимальный допустимый код, который воспроизводит эту проблему:

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
  <title>Test</title>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="css/jquery.mobile-1.3.2.css" />
  <script src="js/jquery-1.9.1.js"></script>
  <script src="js/jquery.mobile-1.3.2.js"></script>
</head>

<body>
<div data-role="page" id="TestPage">

  <div data-role="content" id="TestContent">

    <p>This is a test</p>

  </div>

</div>

</body>
</html>

Ответ 1

В моем случае это было вызвано тем, что я забыл указать значение атрибута for для метки:

Отсутствует идентификатор

<label for="">Stuff:</label>

фиксированный

<label for="someID">Stuff:</label>

РЕДАКТИРОВАТЬ: удаление атрибута for также предотвращает это предупреждение

<label>Stuff:</label>

Ответ 2

Как указано в удаленном ответе и в комментариях, это была ошибка в Mobile jQuery, и теперь она исправлена. Сравните поведение 1.3.2 и 1.4.5 (текущая версия):

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
  <title>Test</title>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!--link rel="stylesheet" href="https://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" /-->
  <link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
  <script src="https://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.js"></script>
  <!--script src="https://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.js"></script-->
</head>

<body>
<div data-role="page" id="TestPage">

  <div data-role="content" id="TestContent">

    <p>This is a test</p>

  </div>

</div>

</body>
</html>

Ответ 3

Пройдя через jsfiddle, я все еще не понял, где вызывается функция document.getElementById(). Я тоже сталкивался с этой проблемой, но поскольку вы используете jquery-mobile, лучше использовать $(# id) в качестве селектора, просто проверьте, вызывается ли эта ссылка document.getElementById() или $('# id') до DOM готов.