2014-10-06 3 views
5

У меня есть следующая структура файлаимя Неопределенное атрибута (роли), затмить

WebContent-> bootstrap->

Js

CSS

IMG

WebContent-> индекс .jsp

Ни один из следующих двух URL-адресов не помогает e неопределенная ошибка атрибута.

Undefined attribute name (data-toggle)

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" 
    pageEncoding="ISO-8859-1"%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<title>Insert title here</title> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" /> 
<script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script> 
</head> 
<body> 
<div class="container"> 

<button type="submit" class="btn btn-default">Submit</button> 
<span class="label label-primary">Primary</span> 
<span class="label label-success">Success</span> 
<span class="label label-info">Info</span> 
<span class="label label-warning">Warning</span> 
<span class="label label-danger">Danger</span> 
<a href="#">Inbox <span class="badge">42</span></a> 


</div> 
<div class="jumbotron"> 
    <h1>Hello, world!</h1> 
    <p>...</p> 
    <p><a class="btn btn-primary btn-lg" role="button">Learn more</a></p> 
</div> 

<div class="dropdown"> 
    <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown"> 
    Dropdown 
    <span class="caret"></span> 
    </button> 
    <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1"> 
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li> 
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li> 
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li> 
    <li role="presentation" class="divider"></li> 
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li> 
    </ul> 
</div> 
</body> 
</html> 

Eclipse, версия подробно перечислены ниже. Spring Tool Suite

Версия: 3.6.1.RELEASE Id Сложение: 201408250818 Платформа: Eclipse, Luna (4,4)

Copyright (с) 2007 - 2014 Pivotal Software, Inc. Все права защищены. Посетите http://spring.io/tools/sts

Этот продукт включает в себя программное обеспечение, разработанное Фондом Apache Software http://www.apache.org

+0

Какая версия Eclipse это? Является ли переключение данных действительным в этой версии HTML? Каков второй из двух URL-адресов? – nitind

ответ

9

Ваш DOCTYPE

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 

для HTML 4.01.

data-* attributes были добавлены в HTML 5. The doctype for HTML 5 в основном либо

<!DOCTYPE html> 

или

<!DOCTYPE html SYSTEM "about:legacy-compat"> 

Это вполне возможно, что ваш IDE не знает HTML 5 и его многочисленных изменений.

0

Новые версии Eclipse поддерживают теги HTML5 и атрибуты data- *, разрешенные в HTML5. Однако при использовании атрибута role правильный синтаксис в соответствии с моделью ARIA Roles и модулем атрибута роли XHTML не должен префикс атрибута роли с данными, а не рольми данных.

So <ul role="menubar"> вернее <ul data-role="menubar">. Справедливость синтаксиса можно проверить с помощью (X) HTML5 Validator. jQuery Mobile довольно широко использует атрибут data-role, хотя я не уверен, почему.

Примечание. Если вы обновляете и вы по-прежнему получаете предупреждения об атрибутах data- *, вы можете рассмотреть возможность обновления или удаления любых установленных синтаксических проверок, таких как JTidy. Начиная с версии 1 службы Indigo атрибут role продолжает запускать предупреждение неопределенного атрибута в Eclipse по умолчанию.

Смежные вопросы