javascript - 为什么 "e.preventDefault()"和 "return false"会禁用该帖子？

Question

我今天遇到了一个问题。我已经解决了。我启发式地解决了它，但是我想要科学的解释(我们不应该是程序员，也是科学家:))

这是我的 MVC 项目的初始 View 代码:

    //shortened for brevity

@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)

    <fieldset>

        <div class="editor-label">
            @Html.LabelFor(model => model.UserName)

        </div>
        <div class="editor-field">
            @Html.TextBoxFor(model => model.UserName, new { onkeyup = "InputToLower(this);" })
            @Html.ValidationMessageFor(model => model.UserName)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.UserPassword)
        </div>
        <div class="editor-field">
            <input type="password" name="password1" id="password1" />
        </div>
        <div class="editor-label">
            <label for="male">Lütfen şifrenizi tekrar giriniz: </label>
        </div>
        <div class="editor-field">
            <input type="password" name="password2" id="password2" />
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.UserEmail)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.UserEmail)
            @Html.ValidationMessageFor(model => model.UserEmail)
        </div>

        <p>                
                <input type="submit" id="registerButton" value="Kayıt Ol" />            
        </p>

    </fieldset>
     }

  <script type="text/javascript">


    $(function () {
        $("#registerButton").click(function (e) {
           // e.preventDefault();
            var errorSummary = $('.validation-summary-errors');
            if (errorSummary.length == 0) {
                $('#listError').remove();
                $('<div class="validation-summary-errors"></div>').insertAfter($('.validation-summary-valid'));
                $(".validation-summary-errors").append("<ul id='listError'><li>0 karakter giremezsiniz. OSI-122 </li></ul>");
            }
            else if (errorSummary.length == 1) {
                $('#listError').remove();
                $(".validation-summary-errors").append("<ul id='listError'><li>You cannot enter more than 20 characters.</li></ul>");
            }
            //return false;
        });

    });

</script>

为简洁起见，代码被缩短。当我禁用e.preventDefault()并返回 false时，发布已完成。 e.preventDefault() 和 return false 如何以及为何阻止发布？您有推荐一本提到此类问题的书吗？提前致谢。

Answer 1

registerButton 是提交按钮，提交的行为是将表单的数据发送到表单标签中提到的操作。如果您没有在表单标签中提及任何操作属性，那么它将命中相同的获取操作的后操作。

event.preventDefault() 并返回 false 会停止您的回发或进一步的事件。