当在“大小”元素中输入过高或过低的数字时,我试图创建自定义错误消息。但是,我无法完成这项工作。我是一名初学者,因此对现有代码进行最少更改的解决方案将是最受赞赏的。
\n\nfunction autoFillcost() {\r\n var size = document.getElementById("size").value;\r\n if (size <= 25)\r\n document.getElementById("cost").value = "\xc2\xa3100";\r\n else if (size >= 26 && size <= 50)\r\n document.getElementById("cost").value = "\xc2\xa3200";\r\n else\r\n document.getElementById("cost").value = "\xc2\xa3300";\r\n}\r\n\r\nfunction sizeValidate() {\r\n var size = document.getElementById("size");\r\n if (!size.checkValidity()) {\r\n size.setCustomValidity("ERROR!");\r\n } else {\r\n size.setCustomValidity("");\r\n }\r\n}Run Code Online (Sandbox Code Playgroud)\r\n<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>\r\n<!DOCTYPE html>\r\n<html>\r\n\r\n<body>\r\n\r\n <form>\r\n\r\n Group Size:<input type="number" min="6" max="200" id="size" onblur="autoFillcost();sizeValidate();" required>\r\n\r\n <p>Cost:<input type="text" id="cost"></p>\r\n\r\n <p id="demo"></p>\r\n\r\n </form>\r\n\r\n</body>\r\n\r\n</html>Run Code Online (Sandbox Code Playgroud)\r\njavascript ×1