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

时间:2017-07-27 15:57:18

标签: javascript jquery html preventdefault onsubmit

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

SELECT HAS_PERMS_BY_NAME(NULL, 'DATABASE', 'CREATE DATABASE')

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

<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()">

但是我收到了错误

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

指向我所缺少的内容?谢谢。

5 个答案:

答案 0 :(得分:1)

您的e.preventDefault使用不正确。它将无效,因为您将事件传递给函数,您希望将它附加到事件处理程序,如下所示:

exception

这将停止提交操作。

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

答案 1 :(得分:1)

这是你想要的吗?

<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();
    }
});

答案 2 :(得分:0)

这里有两个问题。首先,您需要return来自onsubmit事件attriubute的函数。其次,您没有将事件传递给函数 - 但是这仅适用于全局事件可用的情况,即。不是火狐。

要解决此问题并改进逻辑,您可以使用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>

答案 3 :(得分:0)

使用on事件监听器

将其更改为

<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();
    }
  });

答案 4 :(得分:0)

使用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);
    }
});