如何在 jQuery 中获取`form.field.value`？

How to get `form.field.value` in jQuery?

提问by rkaartikeyan

in javascript i can validate a form on submit like below:-

在javascript中，我可以在提交时验证表单，如下所示：-

<form action="" method="post" onsubmit="return validate(this)">
    <input type="text" name="uName" id="uName" />
    <input type="password" name="passKey" id="passKey" />
    <input type="submit" name="loginBtn" value="login" />
</form>

<script type="text/javascript">
function validate(loginForm){
    if(loginForm.uName.value == ''){
        alert('Please Enter Username');
        loginForm.uName.focus();
    }else if(loginForm.passKey.value == ''){
        alert('Please Enter Password');
        loginForm.passKey.focus();
    }else {
        return true;
    }
}
</script>

I tried with below jQuery Code

我尝试使用以下 jQuery 代码

<form action="" method="post">
    <input type="text" name="uName" id="uName" />
    <input type="password" name="passKey" id="passKey" />
    <input type="submit" name="loginBtn" value="login" />
</form>
<script type="text/javascript">
    $('form').submit(function(loginForm){
        if(loginForm.uName.val() == ''){
            alert('Please enter username');
            loginForm.uName.focus();
        }else if(loginForm.passKey.val() == ''){
            alert('Please enter username');
            loginForm.passKey.focus();
        }else {
            return true;
        }

        return false;
    });
</script>

But not works me... please help me...!

但对我不起作用...请帮助我...！

采纳答案by roasstbeef

like this?

像这样？

$('#submit').click(function(){
    if( $('#uName').val() == ''){
        alert('empty');
    }
});

http://jsfiddle.net/TTmYk/

http://jsfiddle.net/TTmYk/

the submit form has a typo in my fiddle u might need to fix that

提交表单在我的小提琴中有一个错字，您可能需要修复它

回答by Arthur Araújo

See the Form Fields jQuery Plugin: https://github.com/webarthur/jquery-fields

请参阅表单字段 jQuery 插件：https: //github.com/webarthur/jquery-fields

You can use the plugin as follows:

您可以按如下方式使用该插件：

var form = $('form#id_form').fields();

form.name.val('Arthur');
form.age.hide();
form.description.css('height', 200);

Or this way:

或者这样：

var form = $('form#id_form').fieldValues();

form.name('Arthur');
form.age(29);
form.description('Web developer.');

var name = form.name();

回答by PSL

The argument in the submit callback function is not the element instead it is the event. So inside the callback thisrepresents the form element so you could just do this.uName.valueand you can avoid the use of id as well. So

提交回调函数中的参数不是元素而是事件。所以在回调内部this代表表单元素，所以你可以这样做this.uName.value，你也可以避免使用 id 。所以

$('form').submit(function(e){
        if(this.uName.value == ''){
            alert('Please enter username');
            this.uName.focus();
        }else if(this.passKey.value == ''){
            alert('Please enter username');
            this.passKey.focus();
        }else {
            return true;
        }

        return false;
    });

Fiddle

小提琴

Plus val()is jquery method, and in plain javascript you would use valueand in this case that should be sufficient enough.

另外val()是 jquery 方法，在普通的 javascript 中你会使用value，在这种情况下应该足够了。

回答by Rubens Mariuzzo

This will help you:

这将帮助您：

jQuery(function($) {

    var $username = $('#uName'),
        $password = $('#passKey');

    $('form').submit(function() {

        if ($username.val() == '') {
            alert('Please enter username');
            $username.focus();
        } else if($password.val() == '') {
            alert('Please enter username');
            $password.focus();
        } else {
            return true;
        }

        return false;
    });
});

Some points you need to keep in mind:

您需要牢记以下几点：

1. If you will work with the DOM you should wrap your code inside a jQuery(function() { ... });block.
2. If you want to access a DOM element with jQuery you need to selectit before using $(...).

1. 如果您将使用 DOM，您应该将您的代码包装在一个jQuery(function() { ... });块中。
2. 如果您要访问使用jQuery DOM元素，你需要选择使用之前$(...)。