表单提交甚至电子邮件已经显示 Jquery 的消息

Posted 2023-05-09

【中文标题】表单提交甚至电子邮件已经显示 Jquery 的消息

【英文标题】：Form submitting even email already message showing Jquery

【发布时间】：2019-10-22 18:52:29

【问题描述】：

我正在尝试使用 jQuery 验证电子邮件可用性，然后显示电子邮件可用性消息。

消息显示成功，但表单也在提交。我只想收到一封电子邮件可用性消息 表格不应提交。我该怎么做？

public function check_emailp()

  $email = $_POST['emailid'];
  $record['data']=$this->Home->check_emailsd($email);
  if ($record['data']=="taken")
  
    echo "<span style='color:red'> Email already exit .</span>";
  
  else
  
    echo "<span style='color:green'> Email Availiable.</span>";
  

function checkemailAvailability() 
  $("#loaderIcon").show();
  var url = '<?php echo base_url(); ?>';
  jQuery.ajax(
    url: url + 'index.php/register/check_emailp',
    data: 'emailid=' + $("#email").val(),
    type: "POST",
    success: function(data) 
      alert(data);
      $("#email-availability-status").html(data);
      $("#loaderIcon").hide();
    ,
    error: function ()
  );

  <form name="myForm"  id ="myForm" action="<?php echo site_url('register/update_info'); ?>" method="POST" enctype="multipart/form-data">
        <input type="text" name="email" id="email"  placeholder="Enter a Location" class="form-control" onBlur="checkemailAvailability()">
      </div>
      <?php //echo form_error('userName'); ?>
      <span id="email-availability-status"></span>
    </div>
    <button type="submit" name="submit" class=" form-control btn btn-info btn-lg hoj-blue-light login-reg-btn bold post-a-job-btn">Sign Up</button>
  </form>
</div>

【问题讨论】：

使用 codeigniter form_validation 库而不是 jQuery 验证电子邮件。

您的意思是onblur 的表单正在提交？

【参考方案1】：

您可以通过 2 种方式实现这一点，

提交时检查电子邮件可用性

当form submit而不是input onBlur时检查电子邮件。

<form onSubmit='return checkemailAvailability()'>

你的 JS 应该是这样的，

function checkemailAvailability() 

 // your implementiations
 // let's say the variable exist is the status

  if (exist) 
     return false;
   else 
     return true;
  

设置变量，并在提交时检查它

你的表格

<form onSubmit='return checkForm()'>

你的js

var emailExist = false;


    function checkemailAvailability() 

     // your implementiations
     // let's say the variable exist is the status

      if (exist) 
         emailExist = true;
      

    

   function checkForm() 

     return emailExist;

   

【参考方案2】：

1.使用onClick="checkemailAvailability()"代替onBlur="checkemailAvailability()"

2.用php检查ajax错误的最佳方法：

$temp_array = array(); //Create temp array to store messages
//if error code will be here
$temp_array['error'] = "You error comment";

//if success code will be here
$temp_array['success'] = "You success comment";

echo json_encode($temp_array);

3.在jquery中成功：

success: function(data) 
      //Parse json data
      var obj = JSON.parse(data);
      if(obj.error)
      
        //Show error message code will be here
        e.preventdefault();
        return false;
      
      else
      
        //show success message code will be here
      
,

【参考方案3】：

试试这个代码

public function check_emailp() $email = $_POST['emailid']; $record['data']=$this->Home->check_emailsd($email);

if ($record['data']=="taken") echo 0; else echo 1;

function checkemailAvailability() $("#loaderIcon").show(); var url = '<?php echo base_url(); ?>'; jQuery.ajax( url: url + 'index.php/register/check_emailp', data: 'emailid=' + $("#email").val(), type: "POST", success: function(data)

//alert(data); if(data==0) var msg='<span style='color:red'> Email already exit .</span>'; else var msg='<span style='color:green'> Email Availiable.</span>'; $("#email-availability-status").html(msg); $("#loaderIcon").hide(); , error: function ()

);