如何取与 fields[m].validationMessage 相邻元素label.innerhtml的值

<style>

.oneline {

    line-height: 1.5;

    margin: 10px auto;

}


.oneline label {

    width: 100px;

    text-indent: 15px;

    font-size: 14px;

    font-family: "Microsoft Yahei";

    display: inline-block;

}


.oneline .sinput {

    width: 60%;

    height: 30px;

    border-radius: 6px;

    border: 1px solid #e2e2e2;

}


.oneline input[type="submit"] {

    margin-left: 20px;

    width: 80px;

    height: 30px;

    border: 0;

    background-color: #5899d0;

    color: #fff;

    font-size: 14px;

    border-radius: 6px;

}


.error-messages {

    color: red;

}

</style>


<body>

    <form id="forms">

        <div class="oneline">

            <label for="name">用户名:</label>

            <input id="name" class="sinput" name="name" type="text" required>

        </div>

        <div class="oneline">

            <label for="email">Email:</label>

            <input id="email" class="sinput" name="email" type="email" required>

        </div>

        <div class="oneline">

            <input type="submit" id="submits" value="提交">

        </div>

    </form>

    <script>

    function replaceValidationUI(form) {

        form.addEventListener("invalid", function(event) {

            event.preventDefault();

        }, true);

        form.addEventListener("submit", function(event) {

            if (!this.checkValidity()) {

                event.preventDefault();

            }

        },true);

        //此处写代码

        var submits = document.getElementById('submits'),

            label = document.getElementsByTagName('label');

        submits.addEventListener('click',function(event){

            var fields = form.querySelectorAll(':invalid'),

                error = form.querySelectorAll('.error-messages'),

                parent;

            for(var i = 0;i<error.length;i++){

                error[i].parentNode.removeChild(error[i]);

            };

            for(var m = 0;m<label.length;m++){

                parent = label[m].parentNode.parentNode;

                parent.insertAdjacentHTML("afterBegin","<div class='error-messages'><ul><li>"+label[m].innerText+fields[m].validationMessage+"</li></ul></div>");

            };

            if (fields.length > 0) {

                fields[0].focus();

            };

        },true)

    }

    var forms = document.getElementById("forms");

    replaceValidationUI(forms);

    </script>

</body>

谁能告诉我,如何取与 fields[m].validationMessage  相邻元素label.innerhtml的值; 想不通,弄了 一下午,是不是脑子不好使。。。 还是不需要取这个label值? 

丛从绿草
浏览 1023回答 0
0回答
打开App,查看更多内容
随时随地看视频慕课网APP