用户输入成功时仍显示错误消息

nkkqxpd9  于 2021-09-23  发布在  Java
关注(0)|答案(1)|浏览(454)

好的,在堆垛机的帮助下,我能够得到一条错误消息,显示在输入表单下面。
我需要的是,当用户在表单中输入任何输入时,不会显示错误消息。我做错了什么?
这是html

  1. <form id="url">
  2. <input type="text" name="urlName">
  3. <input type="submit" value="Build Your App"></input>
  4. </form>
  5. <div id="error-message">
  6. </div>

这是js

  1. document.getElementById("url").addEventListener("submit", (event) => {
  2. event.preventDefault()
  3. let errorMessage = document.getElementById("error-message").innerHTML = "Please provide your store URL";
  4. let myForm = document.getElementById("url");
  5. let formData = new FormData(myForm);
  6. if (formData.get("urlName") === "")
  7. return errorMessage;
  8. EndOfUrl = sanitizeDomainInput(formData.get("urlName"));
  9. newUrl = redirectLink(EndOfUrl);
  10. window.location.href = newUrl;
  11. return false;
  12. });
  13. function sanitizeDomainInput(input) {
  14. input = input || 'unknown.com'
  15. if (input.startsWith('http://')) {
  16. input = input.substr(7)
  17. }
  18. if (input.startsWith('https://')) {
  19. input = input.substr(8)
  20. }
  21. var regexp = new RegExp(/^(([a-zA-Z]{1})|([a-zA-Z]{1}[a-zA-Z]{1})|([a-zA-Z]{1}[0-9]{1})|([0-9]{1}[a-zA-Z]{1})|([a-zA-Z0-9][a-zA-Z0-9-_]{1,61}[a-zA-Z0-9]))\.([a-zA-Z]{2,6}|[a-zA-Z0-9-]{2,30}\.[a-zA-Z]{2,3})$/)
  22. return regexp.test(input) ? input : 'unknown.com';
  23. }
  24. function redirectLink(domain) {
  25. return `https://dashboard.getorda.com/signup/?state=${domain}`;
  26. }
pgccezyw

pgccezyw1#

您正在将错误消息分配给错误消息容器div,而不管在任何情况下是否存在导致消息出现的错误。
请参阅下面的代码段,其中我已将错误消息分配移动到错误条件中。

  1. document.getElementById("url").addEventListener("submit", (event) => {
  2. event.preventDefault()
  3. let errorMessage = "Please provide your store URL";
  4. let myForm = document.getElementById("url");
  5. let formData = new FormData(myForm);
  6. if (formData.get("urlName") === "") {
  7. document.getElementById("error-message").innerHTML = errorMessage;
  8. }
  9. EndOfUrl = sanitizeDomainInput(formData.get("urlName"));
  10. newUrl = redirectLink(EndOfUrl);
  11. window.location.href = newUrl;
  12. return false;
  13. });
  14. function sanitizeDomainInput(input) {
  15. input = input || 'unknown.com'
  16. if (input.startsWith('http://')) {
  17. input = input.substr(7)
  18. }
  19. if (input.startsWith('https://')) {
  20. input = input.substr(8)
  21. }
  22. var regexp = new RegExp(/^(([a-zA-Z]{1})|([a-zA-Z]{1}[a-zA-Z]{1})|([a-zA-Z]{1}[0-9]{1})|([0-9]{1}[a-zA-Z]{1})|([a-zA-Z0-9][a-zA-Z0-9-_]{1,61}[a-zA-Z0-9]))\.([a-zA-Z]{2,6}|[a-zA-Z0-9-]{2,30}\.[a-zA-Z]{2,3})$/)
  23. return regexp.test(input) ? input : 'unknown.com';
  24. }
  25. function redirectLink(domain) {
  26. return `https://dashboard.getorda.com/signup/?state=${domain}`;
  27. }
  1. <form id="url">
  2. <input type="text" name="urlName">
  3. <input type="submit" value="Build Your App"></input>
  4. </form>
  5. <div id="error-message">
  6. </div>
展开查看全部

相关问题