Question

Int he below code a textarea is added 6 times and initially the textarea conatins the text Enter Text.
My question is, if the user enters data in first and third textareas.
How to give alert to the user saying that the “textareas are empty” this is a general message but focus on the 2nd textarea and when the user enters data in 2nd the next textarea should be focused.

 <script>  
 function ad_R(count)
 {
  //Adding and populating table row 
  var row = '<tr>';
  row += '<td>';
  row += '<textarea rows = "8" cols = "18" border ="0" class="input" style="border:none;overflow:visible;width:100%;" id="details'+count+'" nfocus="if (this.value == \'Enter text\') this.value = \'\';" onblur="if (this.value == \'\') this.value = \'Enter text\';" name ="detail'+count+'" class="row_details'+r_count+'">Enter text</textarea></td></tr>';
  }

  $(document).ready(function() {
   cnt += '<table cellspacing="0" cellpadding="0" border="1" width="100%" id="_table">';
   cnt += '<tr>';
   cnt += '<th width="30%">Category</th>';
   cnt += '</tr>';
   for(var i=0;i<6;i++)
   {
      cnt += add_R(6);
     }
    cnt += '</table>';

   });

Answer 1

In general, you should get rid of those inline handlers like onblur=.

Use jQuery for all those events instead. For Instance

$('textarea').bind('focusout', function(e){
   if($(this).val() == "")
      alert('Textarea ' + this.id + ' is empty');
});

I’m afraid I didn’t fully understand what you are trying to do further, but I’m sure
you can manage all your needs with some handlers.

$('textarea').bind('keydown', function(e){
   var $next = $(this).next('textarea');
   if($next) $next.focus();
});

would jump to the next textarea (even if I wouldn’t know why)

edit
since you are adding those textareas onthefly, you maybe should use .live() or
even better .delegate() to bind those event handlers.