How can I add HTML inside a Javascript function?

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

    How can I add HTML inside a Javascript function?

    Hello,

    I am new to JS and am trying to add some HTML into a JS function. So
    that when called the script as well as the HTML will be invoked. Is
    there some type of embed mechanism, sort of the reverse of embedding JS
    in an html page with the script tag. (which is what I am doing in this
    case)

    Is this even possible?

    ....(does not work)
    <script>
    function alertuser() {
    alert("FOO FOO");
    <html><input type="file" name="file.1" tabindex="1"> </html>
    }
    </script>
    ....

    Any help will be greatly appreciated!
    Thanks!

  • Michael Winter

    #2
    Re: How can I add HTML inside a Javascript function?

    On 10/06/2005 04:28, VictorG wrote:

    [snip]
    [color=blue]
    > Is there some type of embed mechanism, sort of the reverse of embedding JS
    > in an html page with the script tag.[/color]

    Search for DynWrite in the group FAQ.

    [snip]

    Mike

    --
    Michael Winter
    Replace ".invalid" with ".uk" to reply by e-mail.

    Comment

    • Razzbar

      #3
      Re: How can I add HTML inside a Javascript function?



      VictorG wrote:[color=blue]
      > Hello,
      >
      > I am new to JS and am trying to add some HTML into a JS function. So
      > that when called the script as well as the HTML will be invoked. Is
      > there some type of embed mechanism, sort of the reverse of embedding JS
      > in an html page with the script tag. (which is what I am doing in this
      > case)
      >
      > Is this even possible?
      >
      > ...(does not work)
      > <script>
      > function alertuser() {
      > alert("FOO FOO");
      > <html><input type="file" name="file.1" tabindex="1"> </html>
      > }
      > </script>[/color]

      Make some place on the page for the input to go, like this...

      <div id = 'daPlace'></div>

      Then use

      <script>
      function alertuser() {
      alert("FOO FOO");
      --> str = '<input type="file" name="file.1" tabindex="1">';
      --> document.getEle mentById('daPla ce').innerHTML = str;
      }
      </script>

      Comment

      • Robert Maas, see http://tinyurl.com/uh3t

        #4
        Re: How can I add HTML inside a Javascript function?

        I'm a super-beginner at J.S.: I never wrote any JavaScript before
        today, but thanks to an online tutorial and reference manual I was able
        to make this: http://members.tripod.com/MaasInfo/New/2005.6.13a.html
        [color=blue]
        > From: "Razzbar" <glakk@potatora dio.f2s.com>
        > <div id = 'daPlace'></div>[/color]
        ...[color=blue]
        > document.getEle mentById('daPla ce').innerHTML = str;[/color]

        I tried something like that, but it didn't work. Would somebody please
        follow that URL and look at the source and tell me what I did wrong?

        And how do you like the rest of what I did, which all works fine (in
        NetScape, the only JavaScript-enabled browser I have access to here)?
        Not bad for first day with the language?

        Comment

        • Razzbar

          #5
          Re: How can I add HTML inside a Javascript function?



          Robert Maas, see http://tinyurl.com/uh3t wrote:[color=blue]
          > I'm a super-beginner at J.S.: I never wrote any JavaScript before
          > today, but thanks to an online tutorial and reference manual I was able
          > to make this: http://members.tripod.com/MaasInfo/New/2005.6.13a.html
          >[color=green]
          > > From: "Razzbar" <glakk@potatora dio.f2s.com>
          > > <div id = 'daPlace'></div>[/color]
          > ..[color=green]
          > > document.getEle mentById('daPla ce').innerHTML = str;[/color]
          >
          > I tried something like that, but it didn't work. Would somebody please
          > follow that URL and look at the source and tell me what I did wrong?[/color]

          You have <div id = " daPlace">
          --------------------^ (an extra space).

          I didn't try too hard to understand you code. I tried fixing it and
          running
          it from my hd, but there were popup issues... I couldn't really see
          from the
          page itself what you were trying to do. If you were trying to change a
          value in a text field, you need to say "somefield.valu e", not just
          "somefield" .

          Comment

          • Robert Maas, see http://tinyurl.com/uh3t

            #6
            Re: How can I add HTML inside a Javascript function?

            > > I'm a super-beginner at J.S.: I never wrote any JavaScript before[color=blue][color=green]
            > > today, but thanks to an online tutorial and reference manual I was able
            > > to make this: http://members.tripod.com/MaasInfo/New/2005.6.13a.html[/color]
            > From: "Razzbar" <glakk@potatora dio.f2s.com>
            > You have <div id = " daPlace">
            > --------------------^ (an extra space).[/color]

            No I don't. You're halucinating. I connected via that URL in your
            copied text from my posting (which I've recopied above here), looked at
            source, and it showed exactly this:
            <div id = "daPlace"></div>
            I suspect you bumped the space bar while you had the source in some
            text editor and didn't notice you'd changed it, then looked carefully
            and saw the space. Try that URL again and see.

            Anyway, this afternoon I was on campus where I had access to online Web
            browsers, and I wanted to see whether the innerHTML usage for the div
            daPlace would work on any of the browsers available there (IE and
            Mozilla Firesomething on desktop, true Mozilla and old obsolete version
            of Netscape available only deep inside the START menus). So I went to
            my Tripod site, skipped over all the top-of-page banner ads, closed all
            the pop-up ads that were on top of my Web page, and noticed that none
            of the text field/area had anything at all in them, which means the
            page load javascript didn't happen. And when I clicked on the buttons
            nothing at all happened, so *everything* U had created was non-working.

            There happened to be a JavaScript expert available, and she copied the
            source from the Tripod page to a local file, omitting the Tripod ads
            (except she failed to copy the <html> and </html> tags, which we'll see
            later was a crucial mistake). So then when we tried a browser on that
            local copy the JavaScript Math arithmetic was working, but the
            innerHTML and java.math.BigIn teger was still broken. But then I used
            FTP to get the original file from my Unix shell account, and when I
            double-clicked on that in Windows both the JavaScript Math stuff and
            the innerHTML were working, while the java.math.BigIn teger was still
            broken.

            Her explanation of the final result was that:
            - The JavaScript Math stuff is standard JavaScript, so that's why it
            works everywhere (except from Tripod where the banner ads somehow break
            JavaScript totally).
            - The innerHTML stuff is a new feature not yet known at the time my
            1999 version of Netscape on my laptop was programmed, so that's why it
            didn't work on my laptop. But all the versions of browsers at DeAnza,
            even the old obsolete Netscape they have hidden away, are new enough to
            have innerHTML installed.
            - My use of java.math.BigIn teger is something that was correct way back
            in 1999 when my old version of Netscape was written, but it's no longer
            correct so none of the new browsers support it. (Do you perhaps know
            what the current way is for doing that?) I found it described in that
            online croczilla JavaScript reference manual:

            See what it says there? What it says works fine in my very old 1999
            version of Netscape, but not in anything newer, sigh. Is there a more
            up to date reference manual that I should be using instead of the very
            very out-of-date croczilla manual?

            So anyway, at that point she suggested I host my JavaScript pages on
            some site that doesn't have banner ads, such as Geocities, so then I
            updated my file to have static text in daPlace that said no button has
            yet been pushed, and set innerHTML sets in all four buttons to say
            which button was pressed (as I originally intended), tested it locally
            (it all works!!), and uploaded the updated file to my Geocities
            account, and tried it: It worked from there exactly the same as from
            local file. So here's the URL:
            Latest news coverage, email, free stock quotes, live scores and video are just the beginning. Discover more every day at Yahoo!

            Please try it in your Web browser and let me know what parts of it work
            as-is.

            Hmm, I notice that it says the toplevel 'java' object is a synonym for
            Packages.java, so maybe if I replace java.math.BigIn teger by
            Packages.java.m ath.BigInteger, it'll still work in my old Netscape but
            will also work in newer browsers? Let me try it in my old Netscape
            right now before posting this ... yup, I've made that change locally on
            my laptop, and Packages.java.m ath.BigInteger works just exactly the
            same as java.math.BigIn teger in my very old Netscape. I can't upload
            the new file to Geocities because they discontinued their FTP server a
            couple years ago so there's now way to upload from Unix, and there's no
            point uploading the new version to my Tripod site where you suffer all
            those problems with banner ads, so please do this: Connect to my
            Geocities copy where everything works except it's still using
            java.math.BigIn teger instead of the more correct
            Packages.java.m ath.BigInteger, and check to see if everything except
            that works, then patch your own private copy of the source to make that
            Packages fix, and see if the BigInteger stuff now works for you.
            Thursday I'll be campus again where I'll be able to upload to my
            Geocities account, but I'd like you to try my stuff before then,
            because Thursday is the last day of classes (final exam is next
            Tuesday), and if I upload something Thursday and it doesn't work I'll
            never again have a chance to fix it.

            Comment

            • Razzbar

              #7
              Re: How can I add HTML inside a Javascript function?

              Maybe Firefox viewsource is hallucinating, but I'm not...

              --------------paste---------

              var b100 = new java.math.BigIn teger("100")
              </script>

              <div id =" daPlace"></div>

              ----------------------------------
              Looks like a space, feels like a space. I don't know if that's your
              problem, but
              it will throw the browser off.

              Also, FF javascript console reports a syntax error. Use that tool.

              Good luck,

              Comment

              • RobG

                #8
                Re: How can I add HTML inside a Javascript function?

                Robert Maas, see http://tinyurl.com/uh3t wrote:
                [...][color=blue]
                > Please try it in your Web browser and let me know what parts of it work
                > as-is.[/color]

                You have a syntax error in the script element containing biBigger():


                function biBigger() {
                var n2 = Math.floor(Math .random()*100)
                var int2 = new java.lang.Integ er(n2);
                var b2 = new java.math.BigIn teger(int2.toSt ring())
                bi = bi.multiply(b10 0).add(b2)
                document.getEle mentById('daPla ce').innerHTML = "
                (Pressed BigInt bigger)"
                document.forms[2].biDisplay.valu e = bi.toString()
                }
                }

                ----^
                One too many braces. biBigger() is not defined so buttons
                "Make java.math.BigIn teger bigger/smaller" don't work.

                Develop with Firefox (or Netscape or Mozilla), use JavaScript console
                (and Venkman maybe), test in IE (and others).

                Your page has HTML errors, use the W3 validator service:

                <URL:http://validator.w3.or g/>

                or

                <URL:http://validator.w3.or g/check?uri=http% 3A%2F%2Fwww.geo cities.com%2Fre m642b%2FJavaScr ipt%2Fjs1.html>



                [...]

                --
                Rob

                Comment

                • Robert Maas, see http://tinyurl.com/uh3t

                  #9
                  Re: How can I add HTML inside a Javascript function?

                  > From: "Razzbar" <glakk@potatora dio.f2s.com>[color=blue]
                  > <div id =" daPlace"></div>
                  > ----------------------------------
                  > Looks like a space, feels like a space.[/color]

                  I followed the Tripod URL from my original post once again just now,
                  looked at source, skipped past the banner ads, and looked at that one
                  line of code:

                  <div id = "daPlace"></div>

                  It looks like a space to me too, but not in the same location where you
                  show it. It's between the equal sign and the quote marks, not between
                  the quote marks and daPlace. Why does this debate remind me of the
                  StarTrek-TNG episode:

                  Troi: Don't you remember the past three years?
                  Worf: Yes I remember them too, but I remember them differently.
                  You and I were not intimate. We did not have any children.
                  I had a wife, another woman, not you. We had a child, Alexander.
                  But my wife died.
                  (That's not an exact quote, just as best I remember the line of discussion.)

                  Razzbar: Don't you see the space?
                  Robert: Yes, I see the space too, but I see it differently located!

                  Comment

                  • Razzbar

                    #10
                    Re: How can I add HTML inside a Javascript function?



                    Robert Maas, see http://tinyurl.com/uh3t wrote:[color=blue][color=green]
                    > > From: "Razzbar" <glakk@potatora dio.f2s.com>
                    > > <div id =" daPlace"></div>
                    > > ----------------------------------
                    > > Looks like a space, feels like a space.[/color]
                    >
                    > I followed the Tripod URL from my original post once again just now,
                    > looked at source, skipped past the banner ads, and looked at that one
                    > line of code:
                    >
                    > <div id = "daPlace"></div>
                    >[/color]
                    [...]
                    [color=blue]
                    > Razzbar: Don't you see the space?
                    > Robert: Yes, I see the space too, but I see it differently located![/color]

                    Well, Robert. I just followed the link again, copied the source to an
                    editor, and lo, on line 225:

                    <div id =" daPlace"></div>

                    Hold the presses... I was looking at the source in Firefox, which is
                    set
                    to block popups. So when I view the source in Explorer, after blocking
                    12 (count'em) twelve cookies and closing two popups, I get a totally
                    different source. The line is now on 219 and there's no space.

                    So go figure.

                    I also found 3 occurances of 'razzbar' in the source that Explorer
                    showed
                    me. Cookies, cookies, cookies.

                    I don't know if it's your host that's the problem, or my browser, or
                    what. But I know you can find a better free host than tripod. A dozen
                    cookies and two popups?! Isn't that almost pornographic?

                    Comment

                    • Robert Maas, see http://tinyurl.com/uh3t

                      #11
                      Re: How can I add HTML inside a Javascript function?

                      > From: RobG <rgqld@iinet.ne t.auau>[color=blue]
                      > You have a syntax error in the script element containing biBigger():
                      > ... One too many braces.[/color]

                      One too many closing braces. Thanks for spotting that. Anyway I thought
                      I had no way to fix it on Geocities, because they discontinued FTP
                      service several years ago, making it impossible to upload files from
                      Unix, and my class at DeAnza college ended with final last Tuesday so I
                      have no access to a system with a full-function Web browser (mozilla
                      something) so I can't use the browser-upload feature. But just tonight
                      as I was about to reply to your article explaining all that mess, I
                      remembered that geocities provides an online HTML-form-textarea editor,
                      whereby I can go into editor, edit in textarea, or do ctrl-X E to enter
                      VI editor, then :wq when done. That can't be used to make new files,
                      but it can be used to make tiny changes in already-uploaded files, so I
                      did that to delete one of the two closing braces.
                      [color=blue]
                      > Your page has HTML errors, use the W3 validator service:
                      > <URL:http://validator.w3.or g/>[/color]

                      Ah, thanks! I never had a use for that before, but now I guess I do. I
                      tried it, and it found more than 30 errors, working from the Geocities
                      hosting, which is an important factor that will come back later. The
                      first was missing <!DOCTYPE ...> as the very first line of the file, so
                      I added that. Next was missing charset declaration, so I added that.
                      Next were several instances where I had just <form> without any action,
                      so I added a totally dummy action="". Next were a large number of
                      errors that had nothing to do with anything in my file. So from my
                      current VI edit buffor I wrote the buffer to a file, moved it to my
                      public_html area on my ISP, and asked the validator about that instead
                      of the identical same file on Geocities. There was only one remaining
                      error in my file:

                      1. Line 57, column 48: there is no attribute "WRAP"
                      <textarea name="biDisplay " rows=6 cols=100 wrap="on"></textarea>

                      So how do I fix that? Without that wrap attribute, when the line of
                      text gets too long (too many digits in Java BigInteger) it makes a
                      scroll bar, which I don't want. With that attribute, it wraps to next
                      line of text area just like I want. What should I do instead to get
                      that effect while making the validator happy?

                      Comment

                      Working...