简体   繁体   English

W3C验证错误与数据HREF

[英]W3C validation error with data-href

I am getting one validation error due to my use of data-href="" in the context of making a whole DIV clickable. 由于在使整个DIV可单击的情况下使用了data-href =“”,因此出现一个验证错误。 The JS and HTML is below. JS和HTML在下面。 What could I do to make this W3C compliant? 我该怎么做才能使其符合W3C?

JQUERY JQUERY

$(function(){
$(".linked").click(function(){
window.location = $(this).attr("data-href");
return false;
});
});

HTML 的HTML

<div class="" data-href="link.html"></div>

If possible, you should consider using a doctype that supports data-* attributes. 如果可能,您应该考虑使用支持data-*属性的文档类型 For HTML5, that's: 对于HTML5,那就是:

<!DOCTYPE html>

Since data-* is part of the HTML5 specification, you need to use the html5-doctype: 由于data-*HTML5规范的一部分,因此您需要使用html5-doctype:

<!DOCTYPE html>

Any other doctype will parse your site according to HTML4 or XMHTML-Rules, where the data-* Attribute is invalid. 其他任何doctype都会根据HTML4或XMHTML规则(其中data-*属性无效)来解析您的网站。

edit: 编辑:

You should always start your html with the proper doctype. 您应该始终以适当的doctype开头html。 Since <!DOCTYPE html> triggers standards-mode in all browser, this is "the only right way" except you really want XHTML for example (although I can't see a reason why you should). 由于<!DOCTYPE html>会在所有浏览器中触发标准模式,因此这是“唯一正确的方式”,除了您确实想要XHTML(尽管我看不出为什么应该这样做)。

edit2: 编辑2:

You might want to consider using an a anchor-tag instead, since it already has an href and is considered to be clickable? 您可能要考虑使用a锚标记,而不是,因为它已经有一个href和被认为是点击?

data- attributes are part of the HTML5 specification so if your document does not have the HTML5 Doctype, the validator will produce an error. 数据属性是HTML5规范的一部分,因此,如果您的文档不具有HTML5 Doctype,则验证器将产生错误。

In the meantime, there is no problem of using those attribute with an HTML4 doctype, the browser will do nothing with it and you'll be able to work with them - the page will simply not validate to the W3C validator. 同时,将那些属性与HTML4 doctype一起使用没有问题,浏览器将不对其执行任何操作,并且您将能够使用它们-页面将完全不会通过W3C验证程序进行验证。

You cool with adding the attribute through jQuery? 您喜欢通过jQuery添加属性吗? Or do we need a more dynamic solution? 还是我们需要一个更动态的解决方案?

$(".linked").attr('data-href', 'link.html').click(function(){
  window.location = $(this).attr("data-href");
  return false;
});

also :

Considering that this isn't a WC3 compliant method have you thought about moving this into the Title attribute? 考虑到这不是 WC3兼容方法,您是否考虑过将其移到Title属性? Remove the '.html'line, and in your click function: 删除“ .html”行,然后在单击功能中:

HTML: HTML:

<div class="" title="link"></div>

jQuery jQuery的

$(".linked").click(function(){
  var dataHref = $(this).attr('title');
  window.location = dataHref.html;
  return false;
});

Then again, we run into issues with propagation. 再说一次,我们遇到传播问题。 I don't know how your links are being propagated, whether you hard-code them or you dynamically create them with server side script, so the latter and previous solutions still not might be good enough for you. 我不知道您的链接是如何传播的,无论是对它们进行硬编码还是使用服务器端脚本动态创建它们,因此后一种和以前的解决方案仍然可能对您不够好。

I was downvoted, as the OP said that the solution provided did not work -- The solution provided works completely fine. 我很沮丧,因为OP表示提供的解决方案不起作用-提供的解决方案完全正常。 Please see the fiddle below, and make sure you don't have errors in your javascript before you downvote someone. 请拒绝下面的小提琴,并在对某人投反对票之前确保您的JavaScript没有错误。

http://jsfiddle.net/n68A8/ http://jsfiddle.net/n68A8/

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM