javascript - jQuery val() undefined - Stack Overflow

admin管理员组

文章数量:1287831

We have the following XHTML table:

  <tr class="encabezado">
    <th scope="col" width="2%">1</th>
    <th scope="col" width="2%">2</th>
    <th scope="col" width="2%">3</th>
    <th scope="col" width="2%">4</th>
    <th scope="col" width="2%">5</th>
    <th scope="col" width="2%">...</th>
    <th scope="col" width="2%">31</th>
  </tr>
  <tr>
    <th scope="row">Area 1<input name="line_config" type="hidden" value="0,5,50" /></th>
    <td class="gantt"> </td>
    <td class="gantt"> </td>
    <td class="gantt"> </td>
    <td class="gantt"> </td>
    <td class="gantt"> </td>
    <td class="gantt">...</td>
    <td class="gantt"> </td>
  </tr>
  <tr>
    <th scope="row">Area 2 <input name="line_config" type="hidden" value="0,0,10" /></th>
    <td class="gantt"> </td>
    <td class="gantt"> </td>
    <td class="gantt"> </td>
    <td class="gantt"> </td>
    <td class="gantt"> </td>
    <td class="gantt">...</td>
    <td class="gantt"> </td>
  </tr>

When there is a click over a TD.gantt element, we want jQuery to get the value from input[name='line_config'] tag. We try the following jQuery code, but val() returned 'undefined':

$(document).ready(function() {
    function sum_day(tag, status, column) {
        var total_day = 0;
        var index_pos = 0;
        var values = 0;

        values = tag.closest('tr').children("input[name='line_config']").val();
        alert(values); //Return undefined

        return total_day;
    }

    $('td.gantt').click(function() {
        var gantt_tag = $('td.preop');

        $(this).toggleClass('preop');
        sum_day(gantt_tag, 'preop', $(this).index());
    });
});

Are we getting right the value way? If anyone can help us, we appreciate... =)

We have the following XHTML table:

  <tr class="encabezado">
    <th scope="col" width="2%">1</th>
    <th scope="col" width="2%">2</th>
    <th scope="col" width="2%">3</th>
    <th scope="col" width="2%">4</th>
    <th scope="col" width="2%">5</th>
    <th scope="col" width="2%">...</th>
    <th scope="col" width="2%">31</th>
  </tr>
  <tr>
    <th scope="row">Area 1<input name="line_config" type="hidden" value="0,5,50" /></th>
    <td class="gantt"> </td>
    <td class="gantt"> </td>
    <td class="gantt"> </td>
    <td class="gantt"> </td>
    <td class="gantt"> </td>
    <td class="gantt">...</td>
    <td class="gantt"> </td>
  </tr>
  <tr>
    <th scope="row">Area 2 <input name="line_config" type="hidden" value="0,0,10" /></th>
    <td class="gantt"> </td>
    <td class="gantt"> </td>
    <td class="gantt"> </td>
    <td class="gantt"> </td>
    <td class="gantt"> </td>
    <td class="gantt">...</td>
    <td class="gantt"> </td>
  </tr>

When there is a click over a TD.gantt element, we want jQuery to get the value from input[name='line_config'] tag. We try the following jQuery code, but val() returned 'undefined':

$(document).ready(function() {
    function sum_day(tag, status, column) {
        var total_day = 0;
        var index_pos = 0;
        var values = 0;

        values = tag.closest('tr').children("input[name='line_config']").val();
        alert(values); //Return undefined

        return total_day;
    }

    $('td.gantt').click(function() {
        var gantt_tag = $('td.preop');

        $(this).toggleClass('preop');
        sum_day(gantt_tag, 'preop', $(this).index());
    });
});

Are we getting right the value way? If anyone can help us, we appreciate... =)

• javascript
• jquery
• css
• jquery-selectors

Share Improve this question Follow edited Apr 12, 2011 at 20:03 John Hartsock 86.9k2323 gold badges135135 silver badges146146 bronze badges asked Jun 14, 2010 at 15:33 betacarbetacar 42622 gold badges99 silver badges2121 bronze badges 2

• Are you trying to get the line_config element that is in the same row as the .gnatt element that was clicked? – user113716 Commented Jun 14, 2010 at 16:27
• Yep. I use index() to get the column and the display the results y other TD element. – betacar Commented Jun 14, 2010 at 18:09

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 7

Note jquery.children() will only return direct/immediate children, and since your input is not a direct/immediate child of the <TR> you will not get any of the inputs.

May I suggest something like this

$("input[name='line_config']", tag.closest('tr'))

children return the immediate children of the tr element. You should try by find i.e.:

values = tag.closest('tr').find("input[name='line_config']").val();

Not sure if this is the whole problem, but when you say var gantt_tag = $('td.preop');, there aren't any elements with the class of preop:

$('td.gantt').click(function() {
  var gantt_tag = $('td.preop');
  alert(gantt_tag.size()); // returns 0, i.e. no elements are matched
});

本文标签： javascriptjQuery val() undefinedStack Overflow