首次单击Jquery时禁用提交按钮

时间:2014-07-09 06:38:19

标签: javascript jquery forms submit-button

我目前有一个灯箱弹出窗口附加到提交按钮,该按钮仅在第一次单击提交按钮时显示。基本上在有人提交表单之前,我们希望他们在点击提交按钮时看到这个弹出窗口。并且一切正常,但现在我需要将其发送到第一次点击的位置,表单不提交/处理。但是,在第一次单击之后,需要启用提交按钮以提交表单。

任何想法如何将以下代码更改为仅在第一次单击提交按钮时提交按钮不处理表单的位置?

   <script type="text/javascript">
    $('#Submitbutton').one("click",function(e) {

    $('#lp').lightbox_me({
    centered: true,
    overlayCSS:{background: '#481d33', opacity: .45},
    overlaySpeed:0,
    lightboxSpeed:0
    });

    });
    </script>

6 个答案:

答案 0 :(得分:5)

var hasClicked = false;
$('#Submitbutton').on('click',function(e) {
    if (hasClicked === true) {
        //submit form here
    } else {
        e.preventDefault();
        hasClicked = true;
        $('#lp').lightbox_me({
            centered: true,
            overlayCSS:{background: '#481d33', opacity: .45},
            overlaySpeed:0,
            lightboxSpeed:0
        });
    }
});

在第一次提交时设置变量,然后在第二次提交时根据该变量执行不同的操作。

编辑:一致的引号和代码清理。

答案 1 :(得分:1)

.on()更改.one()。您可以声明一个变量来跟踪是否单击了按钮。

var isAlreadytClicked = false;
$('#Submitbutton').on("click", function (e) {
    if (isAlreadytClicked == false) {
        isAlreadytClicked = true;
        return;
    }

    if (isAlreadytClicked) {
        //Do whatever you want on subsequent click

    }
});

答案 2 :(得分:1)

添加行

$('#SubmitBtn').attr('disabled',false);

if块内的

答案 3 :(得分:0)

您可以使用计数器确定点击次数:

 var count = 0;
 $('#Submitbutton').click(function(e) {
 count++;
 if(count==1)
 return;//return if clicked first time
 $('#lp').lightbox_me({centered: true,overlayCSS:{background: '#481d33', opacity: .45},overlaySpeed:0,lightboxSpeed:0});
 });

答案 4 :(得分:0)

<input type="button"  id="SubmitBtn" value="Submit" onclick="return submitData();" disabled="disabled" >

在剧本中

//create a global variable for clicked or not
var submitBtnClicked = false;

function submitData()
{
 if(submitBtnClicked )
 {
   $('#SubmitBtn').attr('disabled',false);
   submitBtnClicked =true;
 }    
}

答案 5 :(得分:-1)

只需返回false即可。 或者,e.perventDefault()可能有助于事件冒泡。

  $('#Submitbutton').one("click",function(e) {

     $('#lp').lightbox_me({
     centered: true,
     overlayCSS:{background: '#481d33', opacity: .45},
     overlaySpeed:0,
     lightboxSpeed:0
     });
    e.perventDefault();
     return false;
  });