value of textarea : problem in firefox

Question

I have written very simple script with jQuery, but the jquery code not working in firefox:

<a href="" class="po">any text</a>
<form>
    <input type="text" class="infobox"/>
    <br />
    <textarea class="me"></textarea>
    <input type="submit"   value="click"  class="submit"/>
</form>

jQuery

var vl = $('.po').text();
$('.po').click(function(){
    $('.me').val(vl);
});

Why this script doesnot work in firefox? Thanks in advance

Answer 1

$(".po") is a link, so you should use event.preventDefault() or return false so you don't navigate away from the page when you click it.

Also make sure you are using script tags

<a href="" class="po">any text</a>
<form>
<input type="text" class="infobox"/>
<br />
<textarea class="me"></textarea>
<input type="submit"   value="click"  class="submit"/>
</form>
<script type="text/javascript">
var vl = $('.po').text();
$('.po').click(function(event){
    $('.me').val(vl);
    event.preventDefault();
});
</script>

Try it out with this jsFiddle

Or, you can put the JS in the head like this:

<html>
<head>
<script type="text/javascript">
$(function() {                                                   \\ <== doc ready
    var vl = $('.po').text();
    $('.po').click(function(event){
        $('.me').val(vl);
        event.preventDefault();
    });
});
</script>
</head>
<body>
<a href="" class="po">any text</a>
<form>
<input type="text" class="infobox"/>
<br />
<textarea class="me"></textarea>
<input type="submit"   value="click"  class="submit"/>
</form>
</body>
</html>

Try it out with this jsFiddle

Answer 2

Your code seems to be fine, try putting it in ready handler:

<script type="text/javascript">
$(function(){
  var vl = $('.po').text();
  $('.po').click(function(){
      $('.me').val(vl);
      return false;
  });
});
</script>