如何使用jquery获取文本字段的val？

Question

code:

<script>
    $(document).ready(function(){
        $(".comments").keyup(function(){
            id = this.id;
            comment = $("#com"+id).val();
            alert(comment); 
        });
    });
</script>
<?php
    $this->db->select('*');
    $this->db->from('contact');
    $where = "admin_id like '%$client_id%'";
    $this->db->where($where);
    $query = $this->db->get();
    $result = $query->result_array();
    foreach ($result as $fet) 
    {
?>
    <tr>
        <td>
            <input type="text" name="comments" class="comments" id="com<?php echo $fet['id']; ?>" />
        </td>
        <td>
            <input type="submit" name="submit" id="submit" value="save" />
        </td>
    </tr>
<?php 
    }
?>

In this code I have multiple text field name comments and I want to alert value of multiple comments text field. Here, when I write something it show me undefine. So, How can I get value of comments field using different id ? Please help me.

Thank You

Answer 1

You need to change, as this.id; will return id , which would be com123 , but on top of that, you are adding com again, which will become comcom123

        id = this.id;
        comment = $('#'+id).val();

Other alternate solution is suggested by other as use this instead.

Answer 2

Change your keyup event with this one. this.id gives you com+id where id you set through php code.

$(".comments").keyup(function(){
        id = this.id;
        comment = $(this).val();
        alert(comment); 
});

Answer 3

  $(document).ready(function(){ $(".comments").keyup(function(){ id = $(this).attr('id'); comment = $("#"+id).val(); alert(comment); }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <tr> <td> <input type="text" name="comments" class="comments" id="com1" /> </td> <td> <input type="submit" name="submit" id="submit" value="save" /> </td> </tr> 

Answer 4

Simply try this keyword, No need to go with id :

  $(document).ready(function(){ $(".comments").keyup(function(){ alert($(this).val()); }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="text" name="comments" class="comments" id="com1" value="this is comment 1" /> <input type="text" name="comments" class="comments" id="com2" value="this is comment 2" /> <input type="text" name="comments" class="comments" id="com3" value="this is comment 3" /> 

Answer 5

So If i understood you correctly, you want to alert each time the user types anything with the value of that specific textbox? Using jQuery, something like this should do it:

 $("input[name=textbox1]").on("keyup", function() { window.alert($(this).val()); }); $("textarea[name=textbox2]").on("keyup", function() { window.alert($(this).val()); }); 

 .form-input { text-align: center; padding: 5px; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form method="POST"> <label>Textbox Example: </label><input type="text" name="textbox1" placeholder="Type Something.." class="form-input" /> <br /> <br /> <label>Textarea Example:</label> <textarea name="textbox2" placeholder="Type Something.." class="form-input"> </textarea> <br /> <br /> <input type="submit" name="submit" value="Submit" class="form-input" /> </form>