开发者

jQuery form validation questions?

I am new to jQuery and javascript and I am used mainly t开发者_运维技巧o php. I am upgrading my site so it contains a little ajax to improve usability and to keep me busy!

I am using this simple little script I threw together for the login page. All works well at the minute but I have a couple of questions I'd like to ask!

$('#loginForm .submit').click(function(event) {
    $('.error').hide();
    event.preventDefault();
    var errors = 0;
    var loginEmail = $('#loginEmail').val();
    var loginPassword = $('#loginPassword').val();

    if (loginEmail.length == 0) {
        $('#loginEmail').after('<div class="error"></div>');
        errors++;
    }

    if (loginPassword.length == 0) {
        $('#loginPassword').after('<div class="error"></div>');
        errors++;
    }

    if (!errors) {
        $('.submit').submit();
    }
 });

You will notice that the first line of code within the function is;

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

Now in php I would normally use;

if (isset(........)) {

Is there a simliar way to do this in javascript as when the user first activates the function there will be no html with the class .error?

Also I am trying to add a new parameter to the function as well as the event parameter, how would I do this? I have tried the following?

$('#loginForm .submit').click(function(event, var) {

$('#loginForm .submit').click(function(event var) {

$('#loginForm .submit').click(function('event', 'var') {

And all seem not to work. Then again I am going by php, jQuery/javascript is not my strong point!

Thanks


Before performing an action, you can check if the function $() selected element by using the following syntax:

if ($('.error').length)
{
    // actions
}


If the .error - div exists in the DOM by default and is just hidden, you can't just check the length of $('.error'), because even if it's empty, length will return 1.

You could do something like this:

if($('.error').html().length !== 0){
  //do something
}

This will check the containing string of the error-div, so if it's empty, length will return 0.

Still I would recommend setting a boolean var. If errors occur, it gets set to false and you can check the var and you do not have to query for DOM-elements for such a simple task.

To your second question, try something like this:

$('#loginForm .submit').bind("click", {variable1: var}, handleSubmit);

function handleSubmit(event){

  var passedVar = event.data.variable1;
}
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜