Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New Coder
    Join Date
    Mar 2011
    Location
    Pakistan
    Posts
    86
    Thanks
    20
    Thanked 0 Times in 0 Posts

    Insert Text in textarea onclick

    I have searched this forum for similar queries & have come up with this
    http://jsfiddle.net/defencedog/P33FR/

    I don't know why this ain't working

  • #2
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,969
    Thanks
    56
    Thanked 557 Times in 554 Posts
    works fine for me on the page, but not in the fiddle...

    Code:
    <html>
    <head>
    <style>
    #smly {
        background:yellow;
        cursor:pointer;
    }
    </style>
    </head>
    
    <body>
    <div id="smly">
    <img onclick="addText(':)')" src="http://illiweb.com/fa/i/smiles/icon_razz.gif" />
    <img onclick="addText(':(')" src="http://illiweb.com/fa/i/smiles/icon_cry.gif" />
    </div>
    
    <form>
    <textarea id="foo"></textarea>
    </form>
    <script type="text/javascript">
    function addText(smiley) {
        document.getElementById('foo').value += " " + smiley + " ";
        document.getElementById('foo').focus();
      
    }
    </script>
    </body>
    </html>

  • #3
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,458
    Thanks
    76
    Thanked 4,373 Times in 4,338 Posts
    Works fine as a web page. Don't know why it doesn't work in jsfiddle.

    Code:
    <html>
    <head>
    <script>
    function addText(smiley) {
    document.getElementById('foo').value += " " + smiley + " ";
    document.getElementById('foo').focus();
    return false;
    }
    </script>
    <style>
    #smly {
    background:yellow;
    cursor:pointer;
    }
    </style>
    </head>
    <body>
    <div id="smly">
    <img onclick="return addText(':)')" src="http://illiweb.com/fa/i/smiles/icon_razz.gif" />
    <img onclick="return addText(':(')" src="http://illiweb.com/fa/i/smiles/icon_cry.gif" />
    </div>
    You really don't need the returns anywhere in that code. onclick in an image has no use for a return value.

    But they obviously don't hurt.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #4
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,458
    Thanks
    76
    Thanked 4,373 Times in 4,338 Posts
    Hmmm...there seems to be an echo in here...

    [But I guess we learned to not trust jsfiddle, didn't we?]
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #5
    New Coder
    Join Date
    Mar 2011
    Location
    Pakistan
    Posts
    86
    Thanks
    20
    Thanked 0 Times in 0 Posts
    Thnx for all the answers
    You really don't need the returns anywhere in that code. onclick in an image has no use for a return value.
    hey sir isn't return a strictly valid syntax to send a value to a function specified elsewhere. Plus I have seen here people have used 'Javascript:addText()' what is the bold part for

  • #6
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,458
    Thanks
    76
    Thanked 4,373 Times in 4,338 Posts
    isn't return a strictly valid syntax to send a value to a function specified elsewhere.
    No. return is use to return a value *FROM* the *CURRENT FUNCTION*.

    It's always valid to return a value from any function. It's just sometimes not needed.

    Code:
    <img ... onclick="return xxxx();" />
    It is *NOT* needed in an <img> tag.
    Code:
    <a ... onclick="return xxxx();">
    It likely *is* needed in an <a> tag, because returning false from the onclick of an <a> tag suppresses the normal action of the <a> tag (which is to jump to the specified href location).

    ******
    Plus I have seen here people have used 'Javascript:addText()' what is the [red] part for
    The only time that is really needed is if you are on a page in MSIE where you have both JavaScript and VBScript functions being used to handle events and you want to make sure that the browser knows that this event handler will be coded as JavaScript. Otherwise, it's kind of a waste of code.

    Well, there's one other place you might use it:
    Code:
    <a href="javascript:doSomething();">
    that basically tells the browser that the href here is *NOT* specifying a URL. Personally, I don't like to use that. I much prefer to use something like
    Code:
    <a href="#" onclick="doSomething(); return false;">
    But each to his/her own.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    defencedog (01-16-2012)

  • #7
    New Coder
    Join Date
    Mar 2011
    Location
    Pakistan
    Posts
    86
    Thanks
    20
    Thanked 0 Times in 0 Posts
    Fiddle bug solved

    In the sidebar, there's a drop down. Select "no wrap (head)" and your script will work.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •