jQuery,无法获得textbox的价值

时间:2022-06-02 20:33:07

In my code, I can get the object but not the value. How can I get the value of the .cups textbox? Thanks.

在我的代码中,我可以得到对象而不是值。如何获取.cups文本框的值?谢谢。

HTML:

<tr id="20">

      <td class="description">CHEESE,FONTINA</td>
      <td><input type="text" class="cups" value=""></td>
      <td><input type="checkbox" class="breakfast"></td>
      <td><input type="checkbox" class="lunch"></td>
      <td><input type="checkbox" class="dinner"></td>
      <td><input type="checkbox" class="snack"></td>
      <td><input type="checkbox" class="favorites"></td>
      <td><label class="addFood"><input type="button" class="input_text_custom input_button" value="Add"></label></td>

</tr>

JS:

$(document).ready(function () {

    $('.addFood').click(function () {

        var tr = $(this).parents('tr');

        var foodId = tr.attr('id');  // works
        var servings = tr.children('.cups');  // returns [object Object]
        var servings = tr.children('.cups').val();  // returns undefined
        alert(servings);

    });

});

2 个解决方案

#1


6  

The <input> is a grandchild of <tr>, not a child, so it won't be selected by .children and you get a jQuery object which has no members when you try it (this is akin to an empty array).

是的孙子,而不是孩子,所以它不会被.children选中,你得到一个jQuery对象,当你尝试它时没有成员(这类似于一个空数组)。

Use .find instead, that operates on descendants.

使用.find代替,对后代进行操作。

#2


3  

I always find that it is best to be as verbose as you can with jQuery selectors. Especially when it comes to classes as there can be more than one element or types of elements that could be matched. Id's are unique so tr#20 is overkill (IMO).

我总是发现最好使用jQuery选择器尽可能冗长。特别是当涉及到类时,可以有多个元素或元素类型可以匹配。 Id是唯一的,所以tr#20是矫枉过正(IMO)。

I would use something like this -

我会用这样的东西 -

var cupsValue = $("#20 input.cups").val();

If you still want to use a derivative of your code, I would also suggest that you use closest() and not parents() (unless there is something I'm missing from your markup). You are only looking for one parent object, the closest tr that is a parent of the current element.

如果您仍想使用代码的衍生物,我还建议您使用nearest()而不是parent()(除非您的标记中缺少某些内容)。您只查找一个父对象,即最接近的tr,它是当前元素的父对象。

#1


6  

The <input> is a grandchild of <tr>, not a child, so it won't be selected by .children and you get a jQuery object which has no members when you try it (this is akin to an empty array).

是的孙子,而不是孩子,所以它不会被.children选中,你得到一个jQuery对象,当你尝试它时没有成员(这类似于一个空数组)。

Use .find instead, that operates on descendants.

使用.find代替,对后代进行操作。

#2


3  

I always find that it is best to be as verbose as you can with jQuery selectors. Especially when it comes to classes as there can be more than one element or types of elements that could be matched. Id's are unique so tr#20 is overkill (IMO).

我总是发现最好使用jQuery选择器尽可能冗长。特别是当涉及到类时,可以有多个元素或元素类型可以匹配。 Id是唯一的,所以tr#20是矫枉过正(IMO)。

I would use something like this -

我会用这样的东西 -

var cupsValue = $("#20 input.cups").val();

If you still want to use a derivative of your code, I would also suggest that you use closest() and not parents() (unless there is something I'm missing from your markup). You are only looking for one parent object, the closest tr that is a parent of the current element.

如果您仍想使用代码的衍生物,我还建议您使用nearest()而不是parent()(除非您的标记中缺少某些内容)。您只查找一个父对象,即最接近的tr,它是当前元素的父对象。