繁体   English   中英

表单仍在提交,尝试使用e.preventDefault();

[英]Form still submits, trying to use e.preventDefault();

所以我有这个表格。 我想检查用户是否有验证码,但是有问题。 这是检查功能的表格。

<form data-id="embedded_signup:form" id="myForm" class="ctct-custom-form Form" name="embedded_signup" method="POST" action="https://visitor2.constantcontact.com/api/signup" onsubmit="check_if_capcha_is_filled()">

这是确定doSubmit(验证码)是否已通过验证的函数。

function check_if_capcha_is_filled(e){
  if(doSubmit) return true;
  e.preventDefault();
  alert('Fill in the capcha!');
  return false;
};

但我得到一个错误

Uncaught TypeError: Cannot read property 'preventDefault' of undefined
at check_if_capcha_is_filled

有什么指向我所缺少的东西吗? 谢谢。

您的e.preventDefault使用不正确。 它不会执行任何操作,因为您要将事件传递给函数,想要将其附加到事件处理程序,如下所示:

$('form').on('submit', function(e)
{
    e.preventDefault();
    //rest of code
})

这将停止提交操作。

参考: http : //api.jquery.com/event.preventDefault/

这是你想要的吗?

<form data-id="embedded_signup:form" id="myForm" class="ctct-custom-form Form" name="embedded_signup" method="POST" action="https://visitor2.constantcontact.com/api/signup">

然后在您的js文件中:

function check_if_capcha_is_filled(){
    if (doSubmit){
        return true;
    }else{
        return false;
    }
};

$('#myForm').on('submit', function(e){
    if (!check_if_capcha_is_filled){
        e.preventDefault();
    }
});

您在这里有两个问题。 首先,您需要从onsubmit事件属性中return函数。 其次,您没有将事件传递给函数-但这仅在全局事件可用的情况下才起作用,即。 不是Firefox。

要解决此问题并改善逻辑,您可以使用addEventListener()毫不干扰地将事件处理程序添加到元素中,并删除过时的on*事件属性。 尝试这个:

 var doSubmit = false; document.getElementById('myForm').addEventListener('submit', function(e) { if (doSubmit) return; e.preventDefault(); alert('Fill in the capcha!'); }); 
 <form data-id="embedded_signup:form" id="myForm" class="ctct-custom-form Form" name="embedded_signup" method="POST" action="https://visitor2.constantcontact.com/api/signup"> <button type="submit">Submit</button> <form> 

事件监听器使用

更改为

<form data-id="embedded_signup:form" id="myForm" class="ctct-custom-form Form" name="embedded_signup" method="POST" action="https://visitor2.constantcontact.com/api/signup" >

 $('form').on('submit', function(e){
    // validation code here
    if(!valid) {
      e.preventDefault();
    }
  });

如果您要确认提交,请使用jQuery。

<button name="delete" class="submitbutton">Delete</button>

$('.submitbutton').click(function() {
    var buttonpressed;
    buttonpressed = $(this).attr('name');
    var r = confirm("Please confirm to " + buttonpressed );

    if (r == true) {
        $('#yourformid').submit();
    } else {
        return (false);
    }
});

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM