Javascript 检查提交时的正则表达式验证，如果为空，则聚焦所有输入字段

我想在单击按钮时检查正则表达式验证。当按钮类型为submit时，它可以正常工作，但它不会重定向到我链接按钮的另一个页面-但是当我将其类型更改为button时，它会正常重定向到另一个页面，并且不会检查正则表达式验证。我还检查是否所有输入字段都已填充，并聚焦任何空字段。但我猜代码有问题

HTML代码：

<form action="" method="POST" role="form" class="payment_form">
    <div class="contact_details">
        <div class="payment_details">
            <div class="form-group">
                <input type="text" class="input_name" id="fullName" pattern="^([a-zA-Z]+\s)*[a-zA-Z]+$" title="Type only characters" name="fullName"  placeholder="FULL NAME" required/>
            </div>
            <div class="form-group">
                 <input type="email" class="input_name" id="email" title="Eg: some@mail.com" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}$" name="email" placeholder="EMAIL ADDRESS" required/>
            </div>
            <div class="form-group">
                <input type="text" class="input_name" id="mobileNumber" maxlength="10" pattern="^(\+\d{1,3}[- ]?)?\d{10}$" title="Enter 10 digit Valid Mobile Number" name="mobileNumber" placeholder="MOBILE NUMBER" required/>
            </div>
        </div>
    </div>  
    <a href="thankyou.html" title=""><button type="submit" class="btn btn-primary pay_btn" >Continue</button></a>   
 </form>    

---

您必须从submit按钮中删除锚定标记，并在操作中写入html页面的名称，这对于表单正确设置字段时的页面重定向非常有效。对于一次一个字段焦点，您必须更改逻辑

我想在单击按钮时检查正则表达式验证。当按钮类型为submit但没有重定向到我链接按钮的另一个页面时，它工作正常

这里发生的事情是，您单击类型为submit的按钮，该按钮将尝试提交表单。因此，

您的验证将用于表单提交

。由于您的表单的

action=“

属性中没有提及任何url，因此您的页面不知道要去哪里。因此，解决方案是将URL添加到此

操作

属性

<form action="thankyou.html" method="POST" role="form" class="payment_form">

但是，当我将按钮类型更改为button时，它通常会重定向到其他页面，并且不会检查正则表达式验证

---

原因是

一旦删除按钮类型submit，它就与表单无关了

。它只是一个普通的按钮。但是您已经将此按钮包装在一个锚定标记中，该锚定标记设置了

href

。因此，这与通过单击链接进行页面重定向一样好，因此表单根本不会提交。因此，您的验证保持安静。因为它只在表单提交时起作用。

@Preety angle，在表单标签

的

action

属性中提供html文件名，如下所示：

<form action="thankyou.html" method="POST" role="form" class="payment_form">
.......
</form>

.......

不应同时在输入字段中聚焦所有内容，这是不可能的@nisar Ok，但当我更改按钮类型以提交时，它会检查正则表达式验证，但不会重定向到其他页面，当所有字段都已填充时，它只会变为空白。知道为什么会发生这种情况吗？正如乌尔瓦希正确地说的那样…这个错误的任何答案：加载资源失败：服务器响应状态为405（不允许使用方法）。当页面重定向时，它在控制台中显示这个错误。您在哪里尝试这些代码@Preety AngelI尝试更改url，但页面未加载。我的意思是屏幕为纯白色。请检查url并进行比较，我的意思是文件是否确实存在于新url（提交后更改）Urvashi当我在浏览器中检查时，它没有显示主体内部的任何内容，但文件在那里。加载资源失败：服务器响应状态为405（不允许使用方法）当页面重定向时，它会在控制台中显示此错误。我在实际操作中使用了它。url正在更改，但设计没有得到更改rendered@PreetyAngel你所说的

设计不被渲染是什么意思。你能指定什么是中断页面没有被加载到url中，它显示页面名称，但屏幕是完全白色的。无论我为Thankyu页面开发了什么布局，都没有加载屏幕，当我检查页面主体时，页面内部没有任何内容，当我刷新页面时，页面显示一条警告，表示确认表单重新提交。此错误的任何答案：加载资源失败：服务器响应状态为405（不允许使用方法）当页面打开时，它会在控制台中显示此错误redirecting@PreetyAngel服务器代码中一定有问题。您的服务器代码语言是什么？
<form action="thankyou.html" method="POST" role="form" class="payment_form">
.......
</form>