点击提交后，输入边框立即消失

Input border immediately disappear after submit click

本文关键字：边框 消失 输入 提交      更新时间：2023-09-26

stackoverflow。

所以，我创造了一个简单的形式，就像一个老板。

<form method="post" action="">
    <input type="text" name = "username">
    <input type="submit" value="Submit">

并添加了一个小脚本

$(document).ready(function(){
       $("input:submit").click(function(){
           $("input[name=username]").css("border", "1px solid red");
       })
    });

我想要什么？我要在点击后突出显示输入框。但我现在想要吗？我按下发送按钮，当然输入字段高亮显示，但这个高亮显示立即消失，我不知道如何修复它。

您正在使用提交按钮。该按钮作为默认事件进行重新加载。使用event.PreventDefault();。它将停止页面重新加载

$(document).ready(function(){
       $("input:submit").click(function(event){
             event.PreventDefault();
           $("input[name=username]").css("border", "1px solid red");
       })
    });

否则，您可以将按钮类型从提交更改为按钮

<form method="post" action="">
    <input type="text" name = "username">
    <input type="button" value="Submit">

点击提交按钮将重新加载页面。您可以通过将按钮类型从submit 更改为button来解决此问题

  <input type="button" value="Submit">
相关文章：