首先显示一个Div,然后在表单中第二次单击按钮时提交

Show a Div first and then Submit on second click of button in a form

本文关键字:表单 第二次 单击 提交 按钮 然后 显示 Div 一个      更新时间:2023-09-26

我有一个表单,多个div具有相同的名称(full-width)。他们都在同一水平上。其中一个是隐藏的(具有hide类)。我想要的是,如果我选择提交,它不应该提交,首先隐藏隐藏div的所有兄弟div(在本例中为full-width),并取消隐藏类hide的div。

现在,当我再次按下,它应该只是提交表单。

- http://jsfiddle.net/xmqvx/2/

你的代码有几个问题:

  1. 您使用event.preventDefault但将event传递为e -应该是e.preventDefault
  2. 你的ID选择器瞄准了一个不存在的ID(更改为#submit-this)

工作代码:

$("#submit-this").click(function (e) {
    e.preventDefault();
    if ($(".full-width").hasClass("hide")) {
        $(".full-width").hide();
        $(".full-width.hide").removeClass("hide").show();
    } else {
        alert("Submitting");
        $("#this-form").submit();
    }
});
http://jsfiddle.net/xmqvx/4/

您还可以像这样利用JavaScript的闭包,以避免让您的行为依赖于您的UI:

$(document).ready(function () {
    var alreadyClicked = false;
    $("#submit-this").click(function (e) {
        e.preventDefault();
        if (alreadyClicked) {
            $('#this-form').submit();
        } else {
            $('.full-width').hide();
            $('.hide').show();
            alreadyClicked = true;
        }
    });
});