自定义属性在IE10中不起作用

时间:2013-07-18 11:22:04

标签: javascript html5

我有输入文字类型

<input type="text" name="firstNameInd" style="width:200px;" required="true" maxlength="100" />

“required”是我使用javascript访问的自定义属性。

这在IE 7和8中工作正常,但在IE10中没有显示required =“”。

可能是因为HTML5中的属性是必需的。

任何人都可以建议做什么吗?

4 个答案:

答案 0 :(得分:4)

假设HTML5 doctype,保留required属性。您应该使用data-前缀作为自定义属性:

<input type="text" name="firstNameInd" style="width:200px;" data-required="true" maxlength="100" />

你可以这样访问:

var required = foo.getAttribute('data-required') // where foo is reference to your input

答案 1 :(得分:3)

如果我误解了您并且您想要真正使用自定义属性,则不能使用名称required

它在HTML 5标准中保留。您必须使用data-required并通过dataset访问它:

element.dataset.required
// or
element.getAttribute("data-required");

<小时/> 您必须指定required或不指定任何属性的值!

<input type="text" ... required="required" />
<input type="text" ... required />

required attribute符合boolean attribute

这些规则适用于布尔属性:

  

如果属性存在,则其值必须为空字符串   或者是属性的ASCII不区分大小写匹配的值   规范名称,没有前导或尾随空格。

     

- http://www.w3.org/TR/html5/infrastructure.html#boolean-attribute

答案 2 :(得分:1)

在html5中,自定义属性以data- *开头 你可以使用

<input type="text" name="firstNameInd" style="width:200px;" data-required="true" maxlength="100" />

然后将其作为

访问
getAttribute("data-required")

进一步阅读

http://html5doctor.com/html5-custom-data-attributes/

感谢

答案 3 :(得分:1)

required 自定义属性;它是HTML5标准的一部分。并且true不是有效值。这可能就是它无法正常工作的原因。

如果您需要自定义属性,正确的符合标准的方法是使用data-为它们添加前缀。这可确保将来不会与标准HTML属性集的任何添加发生冲突。

在这种情况下,如果你想使用HTML5 required属性,它就像一个布尔属性,类似于disabledreadonly,因为你只需要指定属性名称,没有值,可以应用它。符合标准的HTML5代码如下所示:

<input type="text" name="foo" required maxlength="100">

这会将required属性添加到DOM中的元素。然后,您可以使用Javascript将该属性设置为truefalse(即布尔值,而不是字符串)来打开或关闭该属性。只需检查它是否已设置,您就可以在JS中访问。

请注意,您的JS代码需要满足这样的事实:在最近的HTML5兼容浏览器中,当您设置required属性时,浏览器已经为您做了一些验证;在现代浏览器中运行时,您可能需要删除一些现有代码,或至少调整它以处理所有情况。

如果你真的想要一个自定义属性,你可以使用data-required="whatever",但在这种情况下这是不必要的,除非你想要与{5}标准的required显着不同的行为。< / p>