设置labels属性的相关代码,让表单为空,点击提交时,弹出自己设置的提示语,在Chrome中能实现,但Firefox不能实现,why?

馨香如梦 发布于 2016/09/24 10:26
阅读 236
收藏 0

这个问题对大家来说应该是很简单的,只是我是新人,懂得太少,希望大家多多指点,拜托了。

代码其实很短的。我学习HTML5新增的labels属性,设置labels属性的相关代码,让表单为空,点击提交时,弹出自己设置的提示语,在Chrome中能实现,但Firefox中不能实现,why?火狐报错的提示是“txtName.labels is undefined”,我实在不知道错在哪儿,怎么解决,麻烦大家帮忙看一下,谢谢。

具体代码如下:

<!doctype html>
<html>
    <head>
        <title>labels</title>
        <meta charset="utf-8">
    </head>
    <body>
        <script>
            function validate(){
                var txtName=document.getElementById("txt_name");
                var button=document.getElementById("btnValidate");
                var form=document.getElementById("testform");
                if (txtName.value.trim()==""){
                    var label=document.createElement("label");
                    label.setAttribute("for","txt_name");
                    form.insertBefore(label, button);
                    txtName.labels[1].innerHTML="请输入姓名";
                    txtName.labels[1].setAttribute("style","font-size:9px; color:red");
                }
            }
        </script>
        <form id="testform" >
        <label id="label" for="txt_name" >姓名:</label>
        <input id="txt_name">
        <input type="button" id="btnValidate" value="验证" onclick="validate()" />
        </form>
    </body>
</html>


加载中
返回顶部
顶部