2013-02-22 56 views
1

首先這裏是我的代碼jquery不被稱爲

好吧,我的問題是,當試圖使用註冊表單時,它不會調用代碼。

我已經檢查了幾次,似乎無法找到一個問題,我在同一頁面上使用登錄腳本,似乎很好。

login.js

$(function() { 

    // Expand 
    $("#open").click(function(){ 
     $("div#panel").slideDown("slow"); 

    }); 

    // Collapse 
    $("#close").click(function(){ 
     $("div#panel").slideUp("slow"); 
    });  

    // Change Text 
    $("#toggle a").click(function() { 
     $("#toggle a").toggle(); 
    });  

// Login proccess Start 
    $('.error').hide(); 
    $(".bt_login").click(function() { 
     // validate input 
     $('.error').hide(); 
     var username = $("input#username").val(); 
     if (username == "") { 
     $("label#username_error").show(); 
     $("input#username").focus(); 
     return false; 
     } 

     var password = $("input#password").val(); 
     if (password == "") { 
     $("label#password_error").show(); 
     $("input#password").focus(); 
     return false; 
     } 
     var rememberMe = $("input#rememberMe").val(); 

// correct data sent 
    var dataString = 'username='+ username + '&password=' + password + '&submit=Login' + '&rememberMe=' + rememberMe; 
    alert (dataString);return false; 
    $.ajax({ 
    type: "POST", 
    url: "../../inc/files/login.php", 
    data: dataString, 
    success: function() { 

    return false; 
    }, 
    error: function(XMLHttpRequest, textStatus, errorThrown) { 
     $('#login_form').html("<div id='message'></div>"); 
     $('#message').html("<h2>!</h2>") 
     .append("<p>Error Details; <br /> Status: ", textStatus, " <br /> Error thrown: ", errorThrown,"</p>") 
     .hide() 
     .fadeIn(1500, function() { 
     $('#message').append("<img id='cross' src='images/cross.png' />"); 
     }); 
    return false;; 
} 
    }); 
    }); 

// End login proccess 

//Registration Process start 

    $("bt_register").click(function() { 
     // validate inpu 
     $('.error').hide(); 
     var username2 = $("input#username2").val(); 
     if (username2 == "") { 
     $("label#username2_error").show(); 
     $("input#username2").focus(); 
     return false; 
     } 
//  var re = new RegExp("/[^a-z0-9\-\_\.]+/i"); 
//  if(re.test(username2) = true) { 
//  $("label#username2_error2").show(); 
//  $("input#username2").focus(); 
//  return false; 
// } 
     var password2 = $("input#password2").val(); 
     if (password2 == "") { 
     $("label#password2_error").show(); 
     $("input#password2").focus(); 
     return false; 
     } 
     var email = $("input#email").val(); 
     if (password == "") { 
     $("label#email_error").show(); 
     $("input#email").focus(); 
     return false; 
     } 

// correct data sent 
    var dataString = 'username='+ username2 + '&password=' + password2 + '&submit=Register' + '&email=' + email; 
    alert (dataString);return false; 
    $.ajax({ 
    type: "POST", 
    url: "../../inc/files/login.php", 
    data: dataString, 
    success: function() { 

    return false; 
    }, 
    error: function(XMLHttpRequest, textStatus, errorThrown) { 
     $('#reg_form').html("<div id='message'></div>"); 
     $('#message').html("<h2>!</h2>") 
     .append("<p>Error Details; <br /> Status: ", textStatus, " <br /> Error thrown: ", errorThrown,"</p>") 
     .hide() 
     .fadeIn(1500, function() { 
     $('#message').append("<img id='cross' src='images/cross.png' />"); 
     }); 
return false; 
    } 

}); 


    }); 
}); 

HTML表單調用Jquery的

<div id="reg_form"> 
    <form class="clearfix" action="" > 
     <h1>Register Here!</h1>    
     <label class="grey" for="username">Username:</label> 
     <input class="text-input" type="text" name="username2" id="username2" value="" size="23" /> 
     <label class="error" for="username2" id="usernamename2_error">This field is required.</label> 
     <label class="error" for="username2" id="usernamename2_error2">Your username contains invalid characters!</label> 
     <label class="grey" for="email">Email:</label> 
     <input class="text-input" type="text" name="email" id="email" size="23" /> 
     <label class="error" for="email" id="email_error">This field is required.</label> 
     <label class="grey" for="password2">Password:</label> 
     <input class="text-input" type="password" name="password2" id="password2" size="23" /> 
     <label class="error" for="password2" id="password2_error">This field is required.</label> 
     <input type="submit" name="submit" value="Register" class="bt_register" /> 
    </form> 
</div> 
+1

螢火蟲中的錯誤是什麼? – 2013-02-22 08:28:28

+0

嘗試使用 '$( 「#開」)生活( 「點擊」,函數(){' _your代碼here_ '});' _Please投票,如果你遇見牛逼useful_ – 2013-02-22 08:35:34

+0

感謝維涅什但問題已解決 – Ciaran 2013-02-22 10:10:56

回答

1

變化

$("bt_register").click(function() { 

TO

$(".bt_register").click(function(event) { 
    event.preventDefault(); 

第二個錯誤是if (password == "") {因爲對於.bt_register單擊事件您沒有定義password變量。

你可以做的是將var password;定義爲global,所以每個點擊事件函數都可以使用它。

我在這裏修改了你的代碼是我做了什麼以及哪些是警告傳遞的字符串。

<script type="text/javascript" src="js/jquery.js"></script> 
<script type="text/javascript"> 

$(function() 
{ 
    var password; 
    $("#open").click(function() 
    { 
     $("div#panel").slideDown("slow"); 
    }); 

    $("#close").click(function() 
    { 
     $("div#panel").slideUp("slow"); 
    });  

    $("#toggle a").click(function() 
    { 
     $("#toggle a").toggle(); 
    });  

    $('.error').hide(); 

    // Start login proccess 

    $(".bt_login").click(function(event) 
    { 
     event.preventDefault(); 
     $('.error').hide(); 

     var username = $("input#username").val(); 
     if (username == "") 
     { 
      $("label#username_error").show(); 
      $("input#username").focus(); 
      return false; 
     } 

     password = $("input#password").val(); 

     if (password == "") 
     { 
      $("label#password_error").show(); 
      $("input#password").focus(); 
      return false; 
     } 
     var rememberMe = $("input#rememberMe").val(); 

     var dataString = 'username='+ username + '&password=' + password + '&submit=Login' + '&rememberMe=' + rememberMe; 
     alert (dataString);return false; 

     $.ajax(
     { 
      type: "POST", 
      url: "../../inc/files/login.php", 
      data: dataString, 
      success: function() 
      { 
       return false; 
      }, 
      error: function(XMLHttpRequest, textStatus, errorThrown) 
      { 
       $('#login_form').html("<div id='message'></div>"); 
       $('#message').html("<h2>!</h2>").append("<p>Error Details; <br /> Status: ", textStatus, " <br /> Error thrown: ", errorThrown,"</p>").hide().fadeIn(1500, function() { 
        $('#message').append("<img id='cross' src='images/cross.png' />"); 
       }); 
       return false;; 
      } 
     }); 
    }); 

    // End login proccess 

    //Registration Process start 

    $(".bt_register").click(function(event) 
    { 
     event.preventDefault(); 
     // validate inpu 
     $('.error').hide(); 
     var username2 = $("input#username2").val(); 

     if (username2 == "") 
     { 
      $("label#username2_error").show(); 
      $("input#username2").focus(); 
      return false; 
     } 

     var password2 = $("input#password2").val(); 
     if (password2 == "") 
     { 
      $("label#password2_error").show(); 
      $("input#password2").focus(); 
      return false; 
     } 

     var email = $("input#email").val(); 
     if (password == "") 
     { 
      $("label#email_error").show(); 
      $("input#email").focus(); 
      return false; 
     } 

     // correct data sent 
     var dataString = 'username='+ username2 + '&password=' + password2 + '&submit=Register' + '&email=' + email; 
     alert (dataString);return false; 

     $.ajax(
     { 
      type: "POST", 
      url: "../../inc/files/login.php", 
      data: dataString, 
      success: function() 
      { 
       return false; 
      }, 
      error: function(XMLHttpRequest, textStatus, errorThrown) 
      { 
       $('#reg_form').html("<div id='message'></div>"); 
       $('#message').html("<h2>!</h2>").append("<p>Error Details; <br /> Status: ", textStatus, " <br /> Error thrown: ", errorThrown,"</p>").hide().fadeIn(1500, function() 
       { 
        $('#message').append("<img id='cross' src='images/cross.png' />"); 
       }); 
       return false; 
      } 
     }); 

    }); 
}); 

</script> 
<div id="reg_form"> 
    <form class="clearfix" action="" > 
     <h1>Register Here!</h1>    
     <label class="grey" for="username">Username:</label> 
     <input class="text-input" type="text" name="username2" id="username2" value="" size="23" /> 
     <label class="error" for="username2" id="usernamename2_error">This field is required.</label> 
     <label class="error" for="username2" id="usernamename2_error2">Your username contains invalid characters!</label> 
     <label class="grey" for="email">Email:</label> 
     <input class="text-input" type="text" name="email" id="email" size="23" /> 
     <label class="error" for="email" id="email_error">This field is required.</label> 
     <label class="grey" for="password2">Password:</label> 
     <input class="text-input" type="password" name="password2" id="password2" size="23" /> 
     <label class="error" for="password2" id="password2_error">This field is required.</label> 
     <input type="submit" name="submit" value="Register" class="bt_register" /> 
    </form> 
</div>
+0

謝謝:)不能相信我沒有看到 – Ciaran 2013-02-22 08:34:36

+0

@Ciaran看到所有更新的代碼格式正確。 – 2013-02-22 08:41:42

+0

@Ciaran隨時歡迎。你應該接受這個答案。 – 2013-02-22 08:43:03

-1

這讓我創建一個標籤並讓它鏈接到一個預定義的函數。將函數包含在文檔正文和標籤之前。

<label class="error" for="username2" id="usernamename2_error2">Your username contains invalid characters! 
功能(開)

0

相反i suggest you to do this with submit form

$("#reg_form").children('form').submit(function (e) { 
    e.preventDefault(); //<------------stops the submission 
    // validate inpu 
    $('.error').hide(); 
    var username2 = $("input#username2").val(); 
    if (username2 == "") { 
     $("label#username2_error").show(); 
     $("input#username2").focus(); 
     return false; 
    } 

    var password2 = $("input#password2").val(); 
    if (password2 == "") { 
     $("label#password2_error").show(); 
     $("input#password2").focus(); 
     return false; 
    } 

    var email = $("input#email").val(); 
    if (password == "") { 
     $("label#email_error").show(); 
     $("input#email").focus(); 
     return false; 
    } 

    // correct data sent 
    var dataString = $(this).serialize(); 
    alert(dataString); 

    $.ajax({ 
     type: "POST", 
     url: "../../inc/files/login.php", 
     data: dataString, 
     success: function() { 
      alert('success.'); 
     }, 
     error: function (XMLHttpRequest, textStatus, errorThrown) { 
      $('#reg_form').html("<div id='message'></div>"); 
      $('#message').html("<h2>!</h2>") 
       .append("<p>Error Details; <br /> Status: ", textStatus, " <br /> Error thrown: ", errorThrown, "</p>") 
       .hide() 
       .fadeIn(1500, function() { 
        $('#message').append("<img id='cross' src='images/cross.png' />"); 
       }); 
       return false; 
     } 

    }); 
}); 
+0

感謝您的這一點,但即時通訊錯誤,現在不再接收我的錯誤消息。 – Ciaran 2013-02-22 09:41:11

0

確定 我THIK您的VAR dataString的格式不正確

你可以試試這個語法

data: '{LiveID: "' + Live_ID + '", CategoryID: "' + Category_ID + '"}',