Question

我有以下html表格。将有许多业务验证 - 如果验证失败，将在元素上设置"error" attribute。

在下面的表单中，我返回一个标志以查看验证是否失败。如何创建一个通用函数来查找具有“error”属性的所有元素，并提醒“errDesc”属性的值？

注意：我正在寻找JavaScript解决方案而不使用其他库。

注意：我的客户端浏览器不支持HTML5

<html>
<head>
    <script type="text/javascript">

        function loadMessage(frm) 
        {
            alert("Page Loaded");
        }
        function CustomSetError(element, msg) {
            alert("calledSUB");
            var isError = false;

            //In productioon code, error will be set based on business validation
            try {

                //Set error
                element.setAttribute("error", "true");
                element.setAttribute("errDesc", msg);

                isError = true;
            }
            catch (e) { }

            return isError;
        }

        function ValidateForm(frm) {
            alert("validate");
            var isErrorPresent = CustomSetError(frm.txtBillAddressText, "TestMessage");

            if (isErrorPresent) {
                return false;
            }
        }

    </script>
</head>
<body bgcolor="#E5DBE2" topmargin="0" leftmargin="0" marginheight="0" marginwidth="0" onload="loadMessage(frmPOHeader)">
    <form name="frmPOHeader" method="post" id="frmPOHeader">
        <input name="txtBillAddressText" class="ArrowSmall" type="text" readonly="readonly" id="txtBillAddressText" fieldname="Bill To" />
        <input name="hidBillToBuyerAddressCD" type="hidden" id="hidBillToBuyerAddressCD" />
        <input type="submit" name="btnSubmit" value="Submit" onclick="return ValidateForm(frmPOHeader);" language="javascript" id="btnSubmit" class="ButtonSmallBlue" />

        <br /><br />
        <input name="txtDummy" class="ArrowSmall" type="text" readonly="readonly" id="txtDummy" fieldname="Dummy" />

    </form>
</body>
</html>

Answer 1

您可以使用querySelectorAll获取所有div。

然后使用hasAttribute检查该元素是否具有属性error

使用getAttribute获取errDesc

// will give all the div
    var a = Array.prototype.slice.call(document.querySelectorAll("div"))
    a.forEach(function(item){
    if(item.hasAttribute('error')){
    console.log(item.getAttribute('errDesc'))
    }
    })

JSFIDDLE

注意：querySelectorAll会选择所有可能代价高昂的div。您实际上可以将class添加到error元素中。 errorDesc可以就像它一样。

然后你可以执行document.querySelectorAll("div.error")，只选择error类

的dom

读取具有“错误”属性和警报的元素

1 个答案: