开发者

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.

0

上一篇:

下一篇:

精彩评论

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

最新问答

问答排行榜