ECSHOP中實作ajax彈跳窗登入功能-js教程-PHP中文網

ECSHOP中實作ajax彈跳窗登入功能

亚连

發布： 2018-05-22 15:59:28

原創

2765 人瀏覽過

本文主要為大家介紹在ecshop中實現ajax彈跳窗登入功能，程式碼簡單易懂，非常不錯，具有參考借鑒價值，需要的朋友參考下

在上篇文章給大家介紹了使用openSpep方法實現Ecshop登入彈窗框效果，大家點選參考下

下面介紹如何實現AJAX彈窗登入。

在ECSHOP中的user.PHP中有處理使用者登入的請求。

/* 处理 ajax 的登录请求 */ 
elseif ($action == &#39;signin&#39;) 
{ 
 include_once(&#39;includes/cls_json.php&#39;); 
 $json = new JSON; 
 $username = !empty($_POST[&#39;username&#39;]) ? json_str_iconv(trim($_POST[&#39;username&#39;])) : &#39;&#39;; 
 $password = !empty($_POST[&#39;password&#39;]) ? trim($_POST[&#39;password&#39;]) : &#39;&#39;; 
 $captcha = !empty($_POST[&#39;captcha&#39;]) ? json_str_iconv(trim($_POST[&#39;captcha&#39;])) : &#39;&#39;; 
 $result = array(&#39;error&#39; => 0, &#39;content&#39; => &#39;&#39;); 
 $captcha = intval($_CFG[&#39;captcha&#39;]); 
 if (($captcha & CAPTCHA_LOGIN) && (!($captcha & CAPTCHA_LOGIN_FAIL) || (($captcha & CAPTCHA_LOGIN_FAIL) && $_SESSION[&#39;login_fail&#39;] > 2)) && gd_version() > 0) 
 { 
  if (empty($captcha)) 
  { 
   $result[&#39;error&#39;] = 1; 
   $result[&#39;content&#39;] = $_LANG[&#39;invalid_captcha&#39;]; 
   die($json->encode($result)); 
  } 
  /* 检查验证码 */ 
  include_once(&#39;includes/cls_captcha.php&#39;); 
  $validator = new captcha(); 
  $validator->session_word = &#39;captcha_login&#39;; 
  if (!$validator->check_word($_POST[&#39;captcha&#39;])) 
  { 
   $result[&#39;error&#39;] = 1; 
   $result[&#39;content&#39;] = $_LANG[&#39;invalid_captcha&#39;]; 
   die($json->encode($result)); 
  } 
 } 
 if ($user->login($username, $password)) 
 { 
  update_user_info(); //更新用户信息 
  recalculate_price(); // 重新计算购物车中的商品价格 
  $smarty->assign(&#39;user_info&#39;, get_user_info()); 
  $ucdata = empty($user->ucdata)? "" : $user->ucdata; 
  $result[&#39;ucdata&#39;] = $ucdata; 
  $result[&#39;content&#39;] = $smarty->fetch(&#39;library/member_info.lbi&#39;); 
 } 
 else 
 { 
  $_SESSION[&#39;login_fail&#39;]++; 
  if ($_SESSION[&#39;login_fail&#39;] > 2) 
  { 
   $smarty->assign(&#39;enabled_captcha&#39;, 1); 
   $result[&#39;html&#39;] = $smarty->fetch(&#39;library/member_info.lbi&#39;); 
  } 
  $result[&#39;error&#39;] = 1; 
  $result[&#39;content&#39;] = $_LANG[&#39;login_failure&#39;]; 
 } 
 die($json->encode($result)); 
}

登入後複製

把上面這段程式碼修改一下，刪除需要驗證碼的部分

改成

/* 处理 ajax弹窗登录请求 */ 
elseif ($action == &#39;ajax_login&#39;) 
{ 
 include_once(&#39;includes/cls_json.php&#39;); 
 $json = new JSON; 
 $username = !empty($_POST[&#39;username&#39;]) ? json_str_iconv(trim($_POST[&#39;username&#39;])) : &#39;&#39;; 
 $password = !empty($_POST[&#39;password&#39;]) ? trim($_POST[&#39;password&#39;]) : &#39;&#39;; 
 $result = array(&#39;error&#39; => 0, &#39;content&#39; => &#39;&#39;); 
 $captcha = intval($_CFG[&#39;captcha&#39;]); 
 if ($user->login($username, $password)) 
 { 
  update_user_info(); //更新用户信息 
  recalculate_price(); // 重新计算购物车中的商品价格 
  $smarty->assign(&#39;user_info&#39;, get_user_info()); 
  $ucdata = empty($user->ucdata)? "" : $user->ucdata; 
  $result[&#39;ucdata&#39;] = $ucdata; 
  $result[&#39;content&#39;] = $smarty->fetch(&#39;library/member_info.lbi&#39;); 
 } 
 else 
 { 
  $result[&#39;error&#39;] = 1; 
  $result[&#39;content&#39;] = $_LANG[&#39;login_failure&#39;]; 
 } 
 die($json->encode($result)); 
}

登入後複製

將

// 不需要登录的操作或自己验证是否登录（如ajax处理）的act 
$not_login_arr = 
array(&#39;login&#39;,&#39;act_login&#39;,&#39;register&#39;,&#39;act_register&#39;,&#39;act_edit_password&#39;,&#39;get_password&#39;,&#39;send_pwd_email&#39;,&#39;password&#39;, &#39;signin&#39;, &#39;add_tag&#39;, &#39;collect&#39;, &#39;return_to_cart&#39;, &#39;logout&#39;, &#39;email_list&#39;, &#39;validate_email&#39;, &#39;send_hash_mail&#39;, &#39;order_query&#39;, &#39;is_registered&#39;, &#39;check_email&#39;,&#39;clear_history&#39;,&#39;qpassword_name&#39;, &#39;get_passwd_question&#39;, &#39;check_answer&#39;);

登入後複製

#改成

// 不需要登录的操作或自己验证是否登录（如ajax处理）的act 
$not_login_arr = 
array(&#39;ajax_login&#39;,&#39;login&#39;,&#39;act_login&#39;,&#39;register&#39;,&#39;act_register&#39;,&#39;act_edit_password&#39;,&#39;get_password&#39;,&#39;send_pwd_email&#39;,&#39;password&#39;, &#39;signin&#39;, &#39;add_tag&#39;, &#39;collect&#39;, &#39;return_to_cart&#39;, &#39;logout&#39;, &#39;email_list&#39;, &#39;validate_email&#39;, &#39;send_hash_mail&#39;, &#39;order_query&#39;, &#39;is_registered&#39;, &#39;check_email&#39;,&#39;clear_history&#39;,&#39;qpassword_name&#39;, &#39;get_passwd_question&#39;, &#39;check_answer&#39;);

登入後複製

common.js檔案下，

在openLginp()方法裡，將newp.innerHTML的HTML程式碼修改下，在登入框標籤裡加個ajaxLoginSubmit()方法。

//生成层内内容 
 newp.innerHTML = &#39;<form id="ajax_loginForm">用户名：<br><input type="text" name="username" id="ajax_username"/>密码：<br><input type="password" name="password" id="ajax_password"/><br><br><button type="button" onclick="ajaxLoginSubmit()">登录</button> <button type="button" onclick="closeLoginForm()">关闭</button></form>&#39;;

登入後複製

再自己寫兩個方法即可

function ajaxLoginSubmit(){ 
 var username = document.getElementById(&#39;ajax_username&#39;).value; 
 var password = document.getElementById(&#39;ajax_password&#39;).value; 
 Ajax.call(&#39;user.php?act=ajax_login&#39;,&#39;username=&#39;+username+&#39;&password=&#39;+password,ajaxLoginResponse,&#39;POST&#39;,&#39;JSON&#39;); 
} 
function ajaxLoginResponse(result){ 
 if(result.error == 0){ 
  alert(&#39;登录成功&#39;); 
 }else{ 
  alert(&#39;登录失败&#39;); 
 } 
 return false; 
}

登入後複製

上面是我整理給大家的，希望今後對大家有幫助。

相關文章：有關AJAX的面試問題（附有答案）

詳細為你解析AJAX的使用方法(程式碼貼上)

######PHP基於反###ajax###推送實作訊息即時推送步驟詳解############ ################

以上是ECSHOP中實作ajax彈跳窗登入功能的詳細內容。更多資訊請關注PHP中文網其他相關文章！