• 0

Using onclick="alert('message')" With a Text File

Asked by Gerowen,

 Share

Question

Grand Master

Gerowen

Posted
Posted

I am using onclick="alert('message')" to pop up a disclaimer on our website for links that go to websites external organization. The disclaimer however is rather long. Is there a way to get it to pull the message from a plain text file instead of me having to paste the disclaimer into the HTML of every single link?

2 answers to this question

Recommended Posts

  • 0
Rising Star

kyosuken

Posted
Posted

Solution number one : Vanilla JS FTW

<!-- // Make sure in your CSS that #message { display:none;} // -->
<div id="message">
Your message !
</div>

<!-- // in your onclick tag : // -->

<a href="somethinghere" onclick="alert(document.getElementById('message').innerHTML);">Click a me !!</a>

So what does it do ? basically stores the lenghty message in a "hidden" div. And then you just have to get the content on the fly when you build your alert !

Note that the code should work, unless i made a typo :) !

Solution number two : jQueryesque solution ~

The Html :

<!-- // We keep the very same method as above cause it's the cleanest IMO and make sure in your CSS that #message { display:none;} // -->
<div id="message">
Your message !
</div>

<!-- // Your links, don't add any inline JS to them ! (that's bad) instead we are going to use some jQuery hooking // -->

<a href="gosomewhere" class="hasmessage">My beautiful link !</a>

The JS :

- Make sure you have jquery added to your <head></head> and the following script by the end of your webpage

&lt;script&gt;
// Make sure the script is in an auto execute routine also to preserve compat with jQuery, and to prevent glob vars collision if any ~
(function($){

// Retrieve the message text from the div
var message = $('#message').html(); 

// we will "hook" on our links that should have the message
// Note that i added the class "hasmessage" so that only the links you want to have the alert will display it
$('.hasmessage').click(function () {

    alert(message);

});

})(jQuery);
&lt;/script&gt;

Methode 2 is the cleanest, cause you do not have a bunch of inline JS everywhere in your code, but it's also the less efficient if you only use jQuery for that (you would load 40KB worth of minified/gzipped JS just for 4 lines of code... well)

But you have the choice now ! :)

  • 0
Grand Master

Gerowen

Posted
  • Author
Posted
  On 28/04/2011 at 08:20, kyosuken said:

Solution number one : Vanilla JS FTW

&lt;!-- // Make sure in your CSS that #message { display:none;} // --&gt;
&lt;div id="message"&gt;
Your message !
&lt;/div&gt;

&lt;!-- // in your onclick tag : // --&gt;

&lt;a href="somethinghere" onclick="alert(document.getElementById('message').innerHTML);"&gt;Click a me !!&lt;/a&gt;

So what does it do ? basically stores the lenghty message in a "hidden" div. And then you just have to get the content on the fly when you build your alert !

Note that the code should work, unless i made a typo :) !

Solution number two : jQueryesque solution ~

The Html :

&lt;!-- // We keep the very same method as above cause it's the cleanest IMO and make sure in your CSS that #message { display:none;} // --&gt;
&lt;div id="message"&gt;
Your message !
&lt;/div&gt;

&lt;!-- // Your links, don't add any inline JS to them ! (that's bad) instead we are going to use some jQuery hooking // --&gt;

&lt;a href="gosomewhere" class="hasmessage"&gt;My beautiful link !&lt;/a&gt;

The JS :

- Make sure you have jquery added to your <head></head> and the following script by the end of your webpage

&lt;script&gt;
// Make sure the script is in an auto execute routine also to preserve compat with jQuery, and to prevent glob vars collision if any ~
(function($){

// Retrieve the message text from the div
var message = $('#message').html(); 

// we will "hook" on our links that should have the message
// Note that i added the class "hasmessage" so that only the links you want to have the alert will display it
$('.hasmessage').click(function () {

    alert(message);

});

})(jQuery);
&lt;/script&gt;

Methode 2 is the cleanest, cause you do not have a bunch of inline JS everywhere in your code, but it's also the less efficient if you only use jQuery for that (you would load 40KB worth of minified/gzipped JS just for 4 lines of code... well)

But you have the choice now ! :)

Thank you very much!

This topic is now closed to further replies.
 Share
Go to question listing

  • Recently Browsing   0 members

    • No registered users viewing this page.

  • Posts

    • 007 First Light's first trailer shows off an action-packed James Bond game

      By MulletMan69 · Posted

      It's just exactly what it looks like. The facial polygon count is low and rigid, and the background appears heavily blurred. You can clearly see jagged edges around the car window as it exits the tunnel. The character animations feel like they're from 2010. The Xbox Series S has performance similar to an RX 570 or GTX 1660, which is disappointing and contributes to holding back game development. The Switch GPU is roughly on par with a 2050 or 3050, which is even worse. Developers have often discussed the challenges and limitations of developing for outdated/low end hardware, noting how it can hold back progress. This isn't a new issue. I am sure we will hear about the "Challenges" they had to overcome here and sacrifices that had to be made for compatibility with the outdated/low end hardware.
    • Pop-up asking me to disable my ad blocker

      By snowy owl · Posted

      Whether on Edge or Firefox, I don't get this prompt to accept cookies, because they're already whitelisted by the Cookie AutoDelete extension, both on Edge and Firefox. And, as I've already said, using Edge (yesterday), Neowin isn't whitelisted (I never use Edge), and I didn't get that pop-up. And this morning, after checking, still no pop-up, and everything is activated, the proof (screenshot), I have no ads on the right side. I must add that I block the following trackers Doubleclick, and Scorecardresearch, as well as a few other undesirable ones, via the Host file. Back to square one! After all, it's a simple click to continue, so I'll do with it. 🤷🏽‍♂️ Thank You
    • Microsoft makes it easier to find PC specs in Windows 11 Settings

      By thartist · Posted

      F'ing FIIINALLY! Much easier to ask people what their hardware is 🙏 and could also very well just say DDR4 or DDR5 without asking to bloat it too much. I'm also curious to see what it will say in More device info...
    • 007 First Light's first trailer shows off an action-packed James Bond game

      By pmrd · Posted

      Sure, that must be why it was revealed at the Sony showcase... the game was announced 5 years ago and the visuals are far from poor, what the hell are you smoking, plus the Switch 2 is pretty much on par with an Xbox Series S. It would be absolutely insane for a dev to build a game "with the Switch 2 in mind" when it's coming to all platforms where the majority of sales will happen.
    • Ancient CD app makes 64-bit comeback to support Windows 11 and probably Windows 10 too

      By Dutchie64 · Posted

      DVD Decrypter & Handbrake. Still works on this end

  • Recent Achievements

    • Week One Done
      jbatch earned a badge
      Week One Done
    • First Post
      Yianis earned a badge
      First Post
    • Rookie
      GTRoberts went up a rank
      Rookie
    • First Post
      James courage Tabla earned a badge
      First Post
    • Reacting Well
      James courage Tabla earned a badge
      Reacting Well

  • Popular Contributors

    1. 1
      +primortal
      400
    2. 2
      +FloatingFatMan
      178
    3. 3
      snowy owl
      170
    4. 4
      ATLien_0
      167
    5. 5
      Xenon
      134
    Show More

  • Tell a friend

    Love Neowin? Tell a friend!