Jquery: Is there some way to make val() return an empty string instead of 'undefined' for an empty list?

Question

With Jquery, is there some way to make val() return an empty string instead of 'undefined' when called against an empty list of elements?

E.g., I have this code:

var x = $('#my-textbox-id').not('.watermark').val();

The idea is that I want to get the value of my textbox, but I want an empty string if it is currently showing the watermark (i don't want the watermark value!).

The selector works, but i don't want 'undefined' - I want an empty string ''.

Answer 1

You can write (...).val() || "".

Only use this for text fields; it will also replace false or the number 0 with "".

Answer 2

Or you can use $.trim to get the expected result.

Example: $.trim($('#my-textbox-id').not('.watermark').val())

Answer 3

How about:

var x = $('#my-textbox-id').hasClass("watermark") ? "" : $('#my-textbox-id').val();

Answer 4

var x = $('#my-textbox-id').not('.watermark').val() == undefined 
? '' 
: $('#my-textbox-id').not('.watermark').val();