简体   繁体   中英

Cannot get jQuery to get 2 values of input boxes

I am developing a little script on jsfiddle.com

I can get it to work with one element like in this jsfiddle: http://jsfiddle.net/8hXGq/3/

Here's the jQuery code:

jQuery(function() {
  $("input[name=action]").click(function() {
    value = $(':Password').val();
    alert(value); 
  });
})

but then when I try to get 2 input values like in this jsfiddle it does not work

Visit http://jsfiddle.net/8hXGq/2/

Here's the jQuery code

jQuery(function(){
$("input[name=action]").click(function(){
    newas = $(':Login').val();

    value = $(':Password').val();
    alert(value); 
    alert(newas);
});
})

How do I fix this problem?

':Password' is shorthand for input[type="password] thus works. Your problem is $(':Login') here you are looking for element input[type="Login] which doesn't exists

Use

jQuery(function () {
    $("input[name=action]").click(function () {
        newas = $("input[name=Login]").val();
        alert(newas);

        value = $(':Password').val();
        alert(value);
    });
})

DEMO

Try this:

jQuery(function(){
$("input[name=action]").click(function(){
    newas = $('input[name=Login]').val();

    value = $('input[name=Password]').val();
    alert(value); 
    alert(newas);
});
});

DEMO

Please try this:

if get value on the basis of name property then use it:

jQuery(function () {
        $("input[name=action]").click(function () {
            var newas = $('input[name=Login]').val();
            var value = $('input[name=Password]').val();

            alert(value);
            alert(newas);
        });
    });

If get value on the basis of id then use it:

jQuery(function () {
        $("input[name=action]").click(function () {
            var newas = $("input[id$='Login']").val();
            var value = $("input[id$='Password']").val()

            alert(value);
            alert(newas);
        });
    });

Change your jquery to look like this

jQuery(function(){
$("input[name=action]").click(function(){
    newas = $('[name=Login]').val();

    value = $('[name=Password]').val();
    alert(value); 
    alert(newas);
});
});

:Password is pseudo for type password, not for name. To access by name use [name=Login] .

Also use var keyword as without var you initialized two global variable which is not allowed in ecmascript 5 strict mode and cause confusion sometime:

jQuery(function () {
    $("input[name=action]").click(function () {
        var newas = $('input[name=Login]').val();
        var value = $(':Password').val();
        alert(value);
        alert(newas);
    });
})

Here is Demo

:password is the Password selector of jQuery, thats why its not working with other pseudos. https://api.jquery.com/password-selector/

i recommend NOT to do it how you did. instead it'll be better to acces by IDs.

this is working: http://jsfiddle.net/Vy23k/1/

<input type="text" size="20" maxlength="15" name="login" id="login" />
<input type="password" size="32" maxlength="64" name="password" autocomplete="off" id="password" />
<input type="submit" name="action" class="button" value="Preview">

jQuery(function(){
    $("input[name=action]").click(function(){
        login = $("#login").val();
        //pw = $(':Password').val();  //pseudo selector
        pw = $("#password").val();   //better way

        alert(login + " - " + pw); 

    });
})

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM