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

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • Michael

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

    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.
  • Hywel Jenkins

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

    In article <70d75507.03092 21246.41561950@ posting.google. com>, mdh_2972
    @hotmail.com says...[color=blue]
    > 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.[/color]

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

    --
    Hywel I do not eat quiche


    Comment

    • Evertjan.

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

      Michael wrote on 22 sep 2003 in comp.lang.javas cript:
      [color=blue]
      > 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.
      >[/color]

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

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



      --
      Evertjan.
      The Netherlands.
      (Please change the x'es to dots in my emailaddress)

      Comment

      • Lee

        #4
        Re: How can I click on a joke and have a new joke appear?

        Michael said:[color=blue]
        >
        >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.[/color]

        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.

        Comment

        • Ron

          #5
          Re: How can I click on a joke and have a new joke appear?

          "Michael" <mdh_2972@hotma il.com> wrote in message
          news:70d75507.0 309221246.41561 950@posting.goo gle.com...[color=blue]
          > 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.[/color]
          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='visibili ty:hidden;'>
          Joke 1
          </div>
          <div ID='b' style='visibili ty: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.





          Comment

          • Michael

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

            "Evertjan." <exjxw.hannivoo rt@interxnl.net > wrote in message news:<Xns93FEEC F282858eejj99@1 94.109.133.29>. ..[color=blue]
            > Michael wrote on 22 sep 2003 in comp.lang.javas cript:
            >[color=green]
            > > 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.
            > >[/color]
            >
            > <script>
            > j=new Array
            > j[0]="haha"
            > j[1]="next joke"
            > j[2]="again"
            > //....
            > j[20]="last joke"
            > </script>
            >
            > <div onclick="this.i nnerHTML=j[Math.floor(Math .random()*21)]">
            > Click here for jokes
            > </div>[/color]


            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.

            Comment

            • Evertjan.

              #7
              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.javas cript:
              [color=blue]
              > "Evertjan." <exjxw.hannivoo rt@interxnl.net > wrote in message
              > news:<Xns93FEEC F282858eejj99@1 94.109.133.29>. ..[color=green]
              >> Michael wrote on 22 sep 2003 in comp.lang.javas cript:
              >>[color=darkred]
              >> > 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.
              >> >[/color]
              >>
              >> <script>
              >> j=new Array
              >> j[0]="haha"
              >> j[1]="next joke"
              >> j[2]="again"
              >> //....
              >> j[20]="last joke"
              >> </script>
              >>
              >> <div onclick="this.i nnerHTML=j[Math.floor(Math .random()*21)]">
              >> Click here for jokes
              >> </div>[/color]
              >
              >
              > 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.
              >[/color]

              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)

              Comment

              • Douglas Crockford

                #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[color=blue][color=green][color=darkred]
                > >> > 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.i nnerHTML=j[Math.floor(Math .random()*21)]">
                > >> Click here for jokes
                > >> </div>[/color]
                > >
                > >
                > > 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.
                > >[/color]
                >
                > 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[/color]

                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"];



                Comment

                • Mike Painter

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


                  "Douglas Crockford" <nospam@laserli nk.net> wrote in message
                  news:bkvlq1$jas $1@sun-news.laserlink. net...
                  <snip >[color=blue][color=green]
                  > > 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[/color]
                  >
                  > Or better, use Math.floor(Math .random() * j.length). That way, you don't[/color]
                  have to[color=blue]
                  > edit the script when the number of jokes changes. And better still, use[/color]
                  the[color=blue]
                  > literal array notation. That way, you don't have to number the jokes.
                  >
                  > j = [
                  > "haha",
                  > "again",
                  > "last joke"];
                  >[/color]
                  Or realize that there are no new jokes.


                  Comment

                  • Evertjan.

                    #10
                    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.javas cript:
                    [color=blue][color=green][color=darkred]
                    >> >> j=new Array
                    >> >> j[0]="haha"
                    >> >> j[1]="next joke"
                    >> >> j[2]="again"
                    >> >> //....
                    >> >> j[20]="last joke"
                    >> >> </script>[/color]
                    >>
                    >> Or you could do Math.random()*3[/color]
                    >
                    > Or better, use Math.floor(Math .random() * j.length). That way, you
                    > don't have to
                    >[/color]

                    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)

                    Comment

                    • Evertjan.

                      #11
                      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.javas cript:[color=blue][color=green]
                      >> j = [
                      >> "haha",
                      >> "again",
                      >> "last joke"];
                      >>[/color]
                      > Or realize that there are no new jokes.[/color]

                      That is a good one !

                      --
                      Evertjan.
                      The Netherlands.
                      (Please change the x'es to dots in my emailaddress)

                      Comment

                      • Lasse Reichstein Nielsen

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

                        "Mike Painter" <mdotpainter@at t.net> writes:
                        [color=blue]
                        > "Douglas Crockford" <nospam@laserli nk.net> wrote in message
                        > news:bkvlq1$jas $1@sun-news.laserlink. net...
                        > <snip >[color=green]
                        > > That way, you don't have to number the jokes.[/color][/color]
                        [color=blue]
                        > Or realize that there are no new jokes.[/color]

                        #751 ?

                        /L
                        --
                        Lasse Reichstein Nielsen - lrn@hotpop.com
                        Art D'HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit. html>
                        'Faith without judgement merely degrades the spirit divine.'

                        Comment

                        • Douglas Crockford

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

                          > >> >> j=new Array[color=blue][color=green][color=darkred]
                          > >> >> j[0]="haha"
                          > >> >> j[1]="next joke"
                          > >> >> j[2]="again"
                          > >> >> //....
                          > >> >> j[20]="last joke"
                          > >> >> </script>
                          > >>
                          > >> Or you could do Math.random()*3[/color]
                          > >
                          > > Or better, use Math.floor(Math .random() * j.length). That way, you
                          > > don't have to
                          > >[/color]
                          >
                          > Not in the case under investigation, where there is a gap in the array ![/color]

                          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.



                          Comment

                          • Michael

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

                            "Evertjan." <exjxw.hannivoo rt@interxnl.net > wrote in message news:<Xns9401E7 5B2FC42eejj99@1 94.109.133.29>. ..[color=blue]
                            > Michael wrote on 25 sep 2003 in comp.lang.javas cript:
                            >[color=green]
                            > > "Evertjan." <exjxw.hannivoo rt@interxnl.net > wrote in message
                            > > news:<Xns93FEEC F282858eejj99@1 94.109.133.29>. ..[color=darkred]
                            > >> Michael wrote on 22 sep 2003 in comp.lang.javas cript:
                            > >>
                            > >> > 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.i nnerHTML=j[Math.floor(Math .random()*21)]">
                            > >> Click here for jokes
                            > >> </div>[/color]
                            > >
                            > >
                            > > 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.
                            > >[/color]
                            >
                            > 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[/color]

                            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.i nnerHTML=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=locatio n.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.

                            Comment

                            • Michael

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

                              "Evertjan." <exjxw.hannivoo rt@interxnl.net > wrote in message news:<Xns9401E7 5B2FC42eejj99@1 94.109.133.29>. ..[color=blue]
                              > Michael wrote on 25 sep 2003 in comp.lang.javas cript:
                              >[color=green]
                              > > "Evertjan." <exjxw.hannivoo rt@interxnl.net > wrote in message
                              > > news:<Xns93FEEC F282858eejj99@1 94.109.133.29>. ..[color=darkred]
                              > >> Michael wrote on 22 sep 2003 in comp.lang.javas cript:
                              > >>
                              > >> > 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.i nnerHTML=j[Math.floor(Math .random()*21)]">
                              > >> Click here for jokes
                              > >> </div>[/color]
                              > >
                              > >
                              > > 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.
                              > >[/color]
                              >
                              > 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[/color]

                              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.

                              Comment

                              Working...