jQuery How to retrieve the name of an input text field using JQuery
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function(){
var pValue = $(".blah").find("p").html();
alert(" Information in Paragraph tag is ### " + pValue);`enter code here`
$(".blah").find($("input:text")).each(function(){
alert("Value inside the Input text field is #### " + this.value);
});
});
</script>
</head>
<body>
<div class="blah">
<p>he he he</p>
<input "type = text name ="userName" value = "abc"/>
<input "type = text name ="id" value = "xyz"/>
</div>
</body>
</html>
Question:
When i run the above HTML code i get the following alerts
- Information in Paragraph tag is ### he he he
- Value inside the Input text field is #### abc
- Value inside the Input text field is #### xyz
I want to retrieve the input text field names (username and id) and place it in the alerts dynamically so that my alerts look as shown below. I want this functionality b开发者_高级运维ecause if the user enters his username and not the id. i want to display that his id is empty.
- Information in Paragraph tag is ### he he he
- Value inside the userName is #### abc
- Value inside the id is #### xyz
Thanks a lot in advance.
If you had a field like this:
<input id="tb" type="text" name="userName" value="abc"/>
And you wanted to get the name attribute in JQuery, it would look like this:
$('#tb').attr("name");
However your inputs are malformed and they do not have Id's or Classes, and looping through them would be extremely inefficient.
Try:
$(".blah").find($("input:text")).each(function(){
alert("Value inside "+$(this).attr("name")+" is #### " + this.value);
});
I am not really sure what your question is. However, to get the name of the control you are selecting:
var nameValue = $('.blah').attr('name');
Your markup has a bunch of error, first fix those errors and to get the name of any input field just say
$("inputIdOrValidSelector").attr('name');
Try this
<div class="blah">
<p>he he he</p>
<input type="text" name="userName" value="abc"/>
<input type="text" name="id" value="xyz"/>
</div>
$(document).ready(function(){
var pValue = $(".blah").find("p").html();
alert(" Information in Paragraph tag is ### " + pValue);
$(".blah").find($("input:text")).each(function(){
alert("Value inside the " + this.name + " is " + this.value);
});
});
alert("Value inside the userName is " + $("input:text[name=userName]").val());
alert("Value inside the id is " + $("input:text[name=id]").val());
Working demo - http://jsbin.com/aruhej
The this
object from within your each
call corresponds to the input
element from the DOM. This element has the name attribute available on it. For example:
alert("Value inside the " + this.name + " is #### " + this.value);
I've created a jsFiddle of this code as well.
精彩评论