jQuery maxlength attribute problem with textareas

Question

With jQuery version 1.2.3 I'm trying to add nodes after textarea elements with attribute 'maxlength' but it doesn't work:

$("textarea[@maxlength]").after("<b>Aint working</b>");

This is the HTML code:

<textarea maxlength="500">This is a test.</textarea>
<textarea maxlength="250">Yet another line.</textarea>
<textarea maxlength="125">Bar or foo, whatever.</textarea>

The odd thing is, if I change the attribute maxlength with e.g. rel than it works just fine!

Check out this real life example: http://www.host2000.be/_temp/jquery_tests_counter.html

PS: I'm aware of the [@attribute] notation which is no longer supported in jQuery 1.3, but this has nothing to do with the problem.

Answer 1

Shot in the dark: it may be because maxlength is not a valid attribute for textareas.

EDIT: I've just tried your example with jQuery 1.3 and removing the @, and it worked flawlessly.

EDIT #2: Using jQuery 1.2.6 it also works without the @... Have you tried removing them?

Answer 2

With your version of jQuery, it works only with a little trick. The implicit value of textarea has different values for different browsers. Firefox, for example has the implicit value of -1.

So, in order your script to work on Firefox you need to do the following:

$("textarea[@maxlength!=-1]").after("<b>Aint working</b>");

Here you can find more info about the implicit values of maxlength attribute.

Enjoy!