此时，元素li上不允许使用属性类别

Question

I came across this Grid/List layout demo from this page , which is pretty neat, but the validator gives this error for the category filter:

Attribute category not allowed on element li at this point.

Here's the filter markup:

<ul>
   <!-- change the "cat-1", "cat-2", "cat-3" with your "Categories ID" -->
     <li class="cat-active" category="prod-cnt">All</li>
     <li class="" category="cat-1">Category 1</li>
     <li class="" category="cat-2">Category 2</li>
     <li class="" category="cat-3">Category 3</li>
</ul>

Is it possible to fix this or use another attribute? Thank you.

Answer 1

Typically custom attributes (those not defined by the W3C) are prefixed with data-

so try: data-category=""

Answer 2

Follow @El Guapo's answer and change this line in the jQuery

var CategoryID = $(this).attr('category');

change to:

var CategoryID = $(this).data('category');

or:

var CategoryID = $(this).attr('data-category');