javascript - 提交按钮在执行 1 个功能后不会发布数据

Question

我这里有登录表单，

   <form action="proseslogin.php" method="POST">
       <input name="username" type="text" placeholder="username">
       <input name="password" type="password" placeholder="password">
       <button class="btn btn-info btn-block login" type="submit">Login</button>
   </form>

js代码

$(function(){
    var textfield = $("input[name=username]");
    $('button[type="submit"]').click(function(e) {
        e.preventDefault();
        //little validation just to check username
        if (textfield.val() != "") {
            //$("body").scrollTo("#output");
            $("#output").addClass("alert alert-success animated fadeInUp").html("Welcome back " + "<span style='text-transform:uppercase'>" + textfield.val() + "</span>");
            $("#output").removeClass(' alert-danger');
            $("input").css({
                "height":"0",
                "padding":"0",
                "margin":"0",
                "opacity":"0"
            });
            //change button text 
            $('button[type="submit"]').html("continue")
                                      .removeClass("btn-info")
                                      .addClass("btn-default")
                    .click(function(){
                        $("input").css({
                            "height":"auto",
                            "padding":"10px",
                            "opacity":"1"
                        }).val("");
                    });

            //show avatar
            $(".avatar").css({
                "background-image": "url(assets/img/clublogo.png)"
            });
        } else {
            //remove success mesage replaced with error message
            $("#output").removeClass(' alert alert-success');
            $("#output").addClass("alert alert-danger animated fadeInUp").html("sorry enter a username ");
         }
         //console.log(textfield.val());
    });
});

表单可以正常工作，但是当我在 javascript 中添加一些函数来制作美观的表单时，按钮永远不会执行操作并发布数据，而是执行循环更改文本按钮函数

Answer 1

因此，您的代码应该仅在 button.html == 'Login' 时执行。只需添加添加 if 即可进行检查。

if ($(this).html() == 'Login') {

之后

$('button[type="submit"]').click(function(e) {
     if ($(this).html() == 'Login') {
     // all you code here
     }
});