How can I click on a joke and have a new joke appear?

Discussion in 'Javascript' started by Michael, Sep 22, 2003.

  1. Michael

    Michael Guest

    I know how to display random jokes or sayings. But only if I reload
    the page does the script select a new saying. How can I click on the
    saying and have it load a new one in its place.
     
    Michael, Sep 22, 2003
    #1
    1. Advertising

  2. Michael

    Lee Guest

    Michael said:
    >
    >I know how to display random jokes or sayings. But only if I reload
    >the page does the script select a new saying. How can I click on the
    >saying and have it load a new one in its place.


    There are many different possibly ways to display random jokes or sayings.

    We would need to know how you're doing it to tell you how best to
    change it so that it changes when you click on it.
     
    Lee, Sep 22, 2003
    #2
    1. Advertising

  3. In article <>, mdh_2972
    @hotmail.com says...
    > I know how to display random jokes or sayings. But only if I reload
    > the page does the script select a new saying. How can I click on the
    > saying and have it load a new one in its place.


    <a href="page.htm">blah blah blah</a>

    --
    Hywel I do not eat quiche
    http://hyweljenkins.co.uk/
    http://hyweljenkins.co.uk/mfaq.php
     
    Hywel Jenkins, Sep 22, 2003
    #3
  4. Michael

    Evertjan. Guest

    Michael wrote on 22 sep 2003 in comp.lang.javascript:

    > I know how to display random jokes or sayings. But only if I reload
    > the page does the script select a new saying. How can I click on the
    > saying and have it load a new one in its place.
    >


    <script>
    j=new Array
    j[0]="haha"
    j[1]="next joke"
    j[2]="again"
    //....
    j[20]="last joke"
    </script>

    <div onclick="this.innerHTML=j[Math.floor(Math.random()*21)]">
    Click here for jokes
    </div>



    --
    Evertjan.
    The Netherlands.
    (Please change the x'es to dots in my emailaddress)
     
    Evertjan., Sep 22, 2003
    #4
  5. Michael

    Ron Guest

    "Michael" <> wrote in message
    news:...
    > I know how to display random jokes or sayings. But only if I reload
    > the page does the script select a new saying. How can I click on the
    > saying and have it load a new one in its place.

    Javascript is CLIENT SIDE
    it can only change what is on the screen based on what has already been sent
    to the browser.

    If you send a page of say 10 jokes you could display 1 then the next on
    clicking a 'next' button.

    a suitable technique is to load each on to its own <div> with a unique ID

    <div ID='a' style='visibility:hidden;'>
    Joke 1
    </div>
    <div ID='b' style='visibility:hidden;'>

    Joke 2
    </div>
    you would be better setting these all in an identical class controlling
    absolute position etc.
    then on clicking the button use getElementbyID to unhide the next and hide
    the previous

    On the other hand,
    If you want to retrieve from a server you would have to use the script to
    modify the URL and fetch the next page but that as you say is reloading the
    page.

    HTH

    Ron.
     
    Ron, Sep 24, 2003
    #5
  6. Michael

    Michael Guest

    Re: How can I click on a joke and have a new joke appear? Part 2

    "Evertjan." <> wrote in message news:<Xns93FEECF282858eejj99@194.109.133.29>...
    > Michael wrote on 22 sep 2003 in comp.lang.javascript:
    >
    > > I know how to display random jokes or sayings. But only if I reload
    > > the page does the script select a new saying. How can I click on the
    > > saying and have it load a new one in its place.
    > >

    >
    > <script>
    > j=new Array
    > j[0]="haha"
    > j[1]="next joke"
    > j[2]="again"
    > //....
    > j[20]="last joke"
    > </script>
    >
    > <div onclick="this.innerHTML=j[Math.floor(Math.random()*21)]">
    > Click here for jokes
    > </div>



    This did not quite work. This is just about what I wanted. I keep
    geting a message that says undefined. I think that the part after
    innerHTML= has to be in the script too.
     
    Michael, Sep 25, 2003
    #6
  7. Michael

    Evertjan. Guest

    Re: How can I click on a joke and have a new joke appear? Part 2

    Michael wrote on 25 sep 2003 in comp.lang.javascript:

    > "Evertjan." <> wrote in message
    > news:<Xns93FEECF282858eejj99@194.109.133.29>...
    >> Michael wrote on 22 sep 2003 in comp.lang.javascript:
    >>
    >> > I know how to display random jokes or sayings. But only if I reload
    >> > the page does the script select a new saying. How can I click on
    >> > the saying and have it load a new one in its place.
    >> >

    >>
    >> <script>
    >> j=new Array
    >> j[0]="haha"
    >> j[1]="next joke"
    >> j[2]="again"
    >> //....
    >> j[20]="last joke"
    >> </script>
    >>
    >> <div onclick="this.innerHTML=j[Math.floor(Math.random()*21)]">
    >> Click here for jokes
    >> </div>

    >
    >
    > This did not quite work. This is just about what I wanted. I keep
    > geting a message that says undefined. I think that the part after
    > innerHTML= has to be in the script too.
    >


    It works all right, tested on IE6, but you have to fill in all 20 texts,
    otherwise you get that "undefined"

    Or you could do Math.random()*3

    --
    Evertjan.
    The Netherlands.
    (Please change the x'es to dots in my emailaddress)
     
    Evertjan., Sep 25, 2003
    #7
  8. Re: How can I click on a joke and have a new joke appear? Part 2

    > >> > I know how to display random jokes or sayings. But only if I reload
    > >> > the page does the script select a new saying. How can I click on
    > >> > the saying and have it load a new one in its place.
    > >> >
    > >>
    > >> <script>
    > >> j=new Array
    > >> j[0]="haha"
    > >> j[1]="next joke"
    > >> j[2]="again"
    > >> //....
    > >> j[20]="last joke"
    > >> </script>
    > >>
    > >> <div onclick="this.innerHTML=j[Math.floor(Math.random()*21)]">
    > >> Click here for jokes
    > >> </div>

    > >
    > >
    > > This did not quite work. This is just about what I wanted. I keep
    > > geting a message that says undefined. I think that the part after
    > > innerHTML= has to be in the script too.
    > >

    >
    > It works all right, tested on IE6, but you have to fill in all 20 texts,
    > otherwise you get that "undefined"
    >
    > Or you could do Math.random()*3


    Or better, use Math.floor(Math.random() * j.length). That way, you don't have to
    edit the script when the number of jokes changes. And better still, use the
    literal array notation. That way, you don't have to number the jokes.

    j = [
    "haha",
    "again",
    "last joke"];

    http://www.JSON.org
     
    Douglas Crockford, Sep 25, 2003
    #8
  9. Michael

    Mike Painter Guest

    Re: How can I click on a joke and have a new joke appear? Part 2

    "Douglas Crockford" <> wrote in message
    news:bkvlq1$jas$...
    <snip >
    > > It works all right, tested on IE6, but you have to fill in all 20 texts,
    > > otherwise you get that "undefined"
    > >
    > > Or you could do Math.random()*3

    >
    > Or better, use Math.floor(Math.random() * j.length). That way, you don't

    have to
    > edit the script when the number of jokes changes. And better still, use

    the
    > literal array notation. That way, you don't have to number the jokes.
    >
    > j = [
    > "haha",
    > "again",
    > "last joke"];
    >

    Or realize that there are no new jokes.
     
    Mike Painter, Sep 26, 2003
    #9
  10. Michael

    Evertjan. Guest

    Re: How can I click on a joke and have a new joke appear? Part 2

    Douglas Crockford wrote on 25 sep 2003 in comp.lang.javascript:

    >> >> j=new Array
    >> >> j[0]="haha"
    >> >> j[1]="next joke"
    >> >> j[2]="again"
    >> >> //....
    >> >> j[20]="last joke"
    >> >> </script>

    >>
    >> Or you could do Math.random()*3

    >
    > Or better, use Math.floor(Math.random() * j.length). That way, you
    > don't have to
    >


    Not in the case under investigation, where there is a gap in the array !



    --
    Evertjan.
    The Netherlands.
    (Please change the x'es to dots in my emailaddress)
     
    Evertjan., Sep 26, 2003
    #10
  11. Michael

    Evertjan. Guest

    Re: How can I click on a joke and have a new joke appear? Part 2

    Mike Painter wrote on 26 sep 2003 in comp.lang.javascript:
    >> j = [
    >> "haha",
    >> "again",
    >> "last joke"];
    >>

    > Or realize that there are no new jokes.


    That is a good one !

    --
    Evertjan.
    The Netherlands.
    (Please change the x'es to dots in my emailaddress)
     
    Evertjan., Sep 26, 2003
    #11
  12. Re: How can I click on a joke and have a new joke appear? Part 2

    "Mike Painter" <> writes:

    > "Douglas Crockford" <> wrote in message
    > news:bkvlq1$jas$...
    > <snip >
    > > That way, you don't have to number the jokes.


    > Or realize that there are no new jokes.


    #751 ?

    /L
    --
    Lasse Reichstein Nielsen -
    Art D'HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit.html>
    'Faith without judgement merely degrades the spirit divine.'
     
    Lasse Reichstein Nielsen, Sep 26, 2003
    #12
  13. Re: How can I click on a joke and have a new joke appear? Part 2

    > >> >> j=new Array
    > >> >> j[0]="haha"
    > >> >> j[1]="next joke"
    > >> >> j[2]="again"
    > >> >> //....
    > >> >> j[20]="last joke"
    > >> >> </script>
    > >>
    > >> Or you could do Math.random()*3

    > >
    > > Or better, use Math.floor(Math.random() * j.length). That way, you
    > > don't have to
    > >

    >
    > Not in the case under investigation, where there is a gap in the array !


    The point was that if the literal object notation is used, there won't be a gap.

    var j = ["haha", "next joke", "again", "last joke"];

    Smaller, faster, easier to edit, no gaps.

    http://www.JSON.org
     
    Douglas Crockford, Sep 26, 2003
    #13
  14. Michael

    Michael Guest

    Re: How can I click on a joke and have a new joke appear? Part 3

    "Evertjan." <> wrote in message news:<Xns9401E75B2FC42eejj99@194.109.133.29>...
    > Michael wrote on 25 sep 2003 in comp.lang.javascript:
    >
    > > "Evertjan." <> wrote in message
    > > news:<Xns93FEECF282858eejj99@194.109.133.29>...
    > >> Michael wrote on 22 sep 2003 in comp.lang.javascript:
    > >>
    > >> > I know how to display random jokes or sayings. But only if I reload
    > >> > the page does the script select a new saying. How can I click on
    > >> > the saying and have it load a new one in its place.
    > >> >
    > >>
    > >> <script>
    > >> j=new Array
    > >> j[0]="haha"
    > >> j[1]="next joke"
    > >> j[2]="again"
    > >> //....
    > >> j[20]="last joke"
    > >> </script>
    > >>
    > >> <div onclick="this.innerHTML=j[Math.floor(Math.random()*21)]">
    > >> Click here for jokes
    > >> </div>

    > >
    > >
    > > This did not quite work. This is just about what I wanted. I keep
    > > geting a message that says undefined. I think that the part after
    > > innerHTML= has to be in the script too.
    > >

    >
    > It works all right, tested on IE6, but you have to fill in all 20 texts,
    > otherwise you get that "undefined"
    >
    > Or you could do Math.random()*3


    Sorry. But for some reason, I could not quite get it to work. So I
    messed around until I got it to work. Here is what I came up with.


    <script>
    j=new Array(2)
    index = Math.floor(Math.random() * j.length) + 1;
    </script>

    <div onclick="this.innerHTML=index">Click Here</div>


    Now I have another question. I just wanted to take it a step at a
    time.

    What I really would like to do, is to put each joke into seperate .js
    files. Otherwise, since I have hundreds of them it would bog down the
    page with too much data and take too long to load into the browser. I
    read at www.netmechanic.com where if it takes more than 8 seconds to
    load the page then most people will just get bored and go elsewhere.

    I have lots of random content and I do not like it when some one has
    to reload the whole page to see a different joke or whatever because
    it increments the counter. So I thought it would be more convenient if
    the person could just click on the joke TEXT and have it display a new
    joke each time.

    But not just 1 time. Over and over again until they got tired of
    reading jokes.

    I tried it with an iframe and then just put onclick=location.reload()
    in the body tag of the html file in the iframe. That way each time I
    clicked on the joke itself the iframe subpage reloaded and displayed a
    new joke from the array. It worked great, except that some of the
    jokes were larger than the iframe window and then I could not see the
    whole thing. I placed each joke in a table, and then gave it a height
    and width. But I did not know how to transfer the height and with of
    the table in the iframe to the iframe height and width. You know so
    that if the table with the joke became larger or smaller the iframe
    would resize as needed.

    So anyway, I thought there must be an easier way.
     
    Michael, Sep 26, 2003
    #14
  15. Michael

    Michael Guest

    Re: How can I click on a joke and have a new joke appear? Part 2

    "Evertjan." <> wrote in message news:<Xns9401E75B2FC42eejj99@194.109.133.29>...
    > Michael wrote on 25 sep 2003 in comp.lang.javascript:
    >
    > > "Evertjan." <> wrote in message
    > > news:<Xns93FEECF282858eejj99@194.109.133.29>...
    > >> Michael wrote on 22 sep 2003 in comp.lang.javascript:
    > >>
    > >> > I know how to display random jokes or sayings. But only if I reload
    > >> > the page does the script select a new saying. How can I click on
    > >> > the saying and have it load a new one in its place.
    > >> >
    > >>
    > >> <script>
    > >> j=new Array
    > >> j[0]="haha"
    > >> j[1]="next joke"
    > >> j[2]="again"
    > >> //....
    > >> j[20]="last joke"
    > >> </script>
    > >>
    > >> <div onclick="this.innerHTML=j[Math.floor(Math.random()*21)]">
    > >> Click here for jokes
    > >> </div>

    > >
    > >
    > > This did not quite work. This is just about what I wanted. I keep
    > > geting a message that says undefined. I think that the part after
    > > innerHTML= has to be in the script too.
    > >

    >
    > It works all right, tested on IE6, but you have to fill in all 20 texts,
    > otherwise you get that "undefined"
    >
    > Or you could do Math.random()*3


    That script example I last gave you is no good. It just displays the
    index number, not the joke in the array. For some reason I cannot get
    it to display the joke. If I put this.innerHTML=j[1] it still says
    undefined.
     
    Michael, Sep 26, 2003
    #15
  16. Michael

    Evertjan. Guest

    Re: How can I click on a joke and have a new joke appear? Part 2

    Michael wrote on 26 sep 2003 in comp.lang.javascript:
    > That script example I last gave you is no good. It just displays the
    > index number, not the joke in the array. For some reason I cannot get
    > it to display the joke. If I put this.innerHTML=j[1] it still says
    > undefined.


    What script are you talking about ?
    Show it again please.

    1 are you using IE and what version? or something else ?

    2 start debugging:

    this.innerHTML="Yes"
    alert(j[1])

    etc.



    --
    Evertjan.
    The Netherlands.
    (Please change the x'es to dots in my emailaddress)
     
    Evertjan., Sep 26, 2003
    #16
  17. Michael

    Mike Painter Guest

    Re: How can I click on a joke and have a new joke appear? Part 2

    "Lasse Reichstein Nielsen" <> wrote in message
    news:...
    > "Mike Painter" <> writes:
    >
    > > "Douglas Crockford" <> wrote in message
    > > news:bkvlq1$jas$...
    > > <snip >
    > > > That way, you don't have to number the jokes.

    >
    > > Or realize that there are no new jokes.

    >
    > #751 ?


    Odd, I don't hear anybody laughing.
    Some people just can't tell a joke.
     
    Mike Painter, Sep 26, 2003
    #17
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. ELJ
    Replies:
    2
    Views:
    574
    Paulo Valentim
    Feb 25, 2005
  2. Jason
    Replies:
    0
    Views:
    490
    Jason
    Feb 19, 2005
  3. Skybuck Flying

    The bad coder joke =D

    Skybuck Flying, Jan 14, 2006, in forum: Java
    Replies:
    20
    Views:
    860
    Alan Brown
    Jan 28, 2006
  4. Lazlo Woodbine
    Replies:
    1
    Views:
    123
    Lazlo Woodbine
    May 14, 2004
  5. Piotr K
    Replies:
    9
    Views:
    111
    Thomas 'PointedEars' Lahn
    Apr 22, 2008
Loading...

Share This Page