Why .val() is always empty (Jquery)?

问题:

I have a problem with an Input.

here's my html/php code :

$dotation = ($ig["dotation"]) ? $ig["dotation"]: '<input type="text" class="datepickerIG" name="igDota" size="8" value="test"/>';
            $bo .= '<tr style="background-color: black;">
                     <td class="dot">' . $dotation . '</td>
                     <td class="modif" ref="' . $ig["id"] . '"><a href="#">Modifier</a></td>

here's my js code :

        var dot_cha = $(this).parent().find('.dot').val();

my question is, why var dot_cha is always empty ?! when I use .html insteed of .val, I get the right so, where's my error ?

Thanks.

回答1:

.val() grabs the value attribute of a input-element. ".dot" is a td and doesn't have a value-attribute.

What exactly is it you want dot_cha to be? If its the input you are after, this would work.

$(this).parent().find('.datepickerIG').val();

If it is the text of the td .html() or .text() will give you this.

回答2:

val retrieves the value of input and other tags which have this attribute. In your case, .dot is the class of a table row which has no attribute value... So you have to use .text() or .html().

回答3:

I would say that the problem is a <td> doesnt have a value, it contains HTML.

That would be why .html works and .val doesnt.

You use .val on inputs that have values, but <td> is not an input its just a HTML tag.

回答4:

val() is to be used with form elements (such as input, textarea etc...), not with elements.

You need to get the innerHTML or innerText of the element.

Something like:

var dot_cha = $(this).parent().find('.dot').text();

Though you need to ensure you have one element - as you may be getting a collection of elements.

回答5:

From the docs:

The .val() method is primarily used to get the values of form elements such as input, select and textarea. In the case of elements, the .val() method returns an array containing each selected option; if no option is selected, it returns null.

回答6:

From the jQuery API documentation:

The .val() method is primarily used to get the values of form elements such as input, select and textarea.

val is used on form elements. Since .dot is a td element (which is not a form element) using val on it will not work. To get the contents of any element other than a form element, use .html or .text

回答7:

The doc here says

The .val() method is primarily used to get the values of form elements such as input, select and textarea.

You're right .html works since in your case you have a td, and you should use

$(".dot").html()

Hope it helps