0

I am trying to use Facebook conversion code like below that includes
both scripts and noscripts tags:

<html>
    <head>
      <script type="text/javascript">

          // Wait for the page to load first
          window.onload = function() {

          //Get a reference to the link on the page
          // with an id of "mylink"
          var a = document.getElementById("mylink");

          //Set code to run when the link is clicked
          // by assigning a function to "onclick"
              a.onclick = function() {
                 // Code to be executed when the link is clicked.
                 var _fbq = window._fbq || (window._fbq = []);
                 ...
              }
            }
          </script>
          <noscript><img height="1" width="1" alt="" style="display:none" src="https://www.facebook.com/tr?ev=6030151253043&amp;cd[value]=0.00&amp;cd[currency]=USD&amp;noscript=1" /></noscript>
    </head>
    <body>
        <a id="mylink" href="http://example.com">Link</a>
    </body>
</html>

Usually I can put this code in a thank you page in my website. But now I have a situation that I want to track if someone clicks an external link which leads to some external webpage that is out of my control. My page should not execute this conversion code when it loads but only when the link is clicked.

For example, my page has a link that goes to http://example.com, so when a user clicks this link, this conversion code can be executed and then go to http://example.com?

The problem is that when the browser does not support JavaScript, the code inside noscript tag will execute even if the link was not clicked.

Is there any way to solve that problem?

Konstantinos Kamaropoulos
  • 487
  • 5
  • 20
Joe Huang
  • 6,296
  • 7
  • 48
  • 81
  • In Facebook conversion code, there is a – Joe Huang Nov 10 '15 at 15:24
  • Code into a noscript tag is used when the script is not supported from the browser. http://www.w3schools.com/tags/tag_noscript.asp – Konstantinos Kamaropoulos Nov 10 '15 at 15:27
  • Consider Googling before posting a question. :) – Konstantinos Kamaropoulos Nov 10 '15 at 15:30
  • So I can add into a onClick function? – Joe Huang Nov 10 '15 at 15:45
  • is an HTML tag. You won't add it "into a onClick function". You can add it after the – Konstantinos Kamaropoulos Nov 10 '15 at 15:50
  • When I say "after the – Konstantinos Kamaropoulos Nov 10 '15 at 15:52
  • Sorry, based on the answer on the other question, my understanding is to execute the whole code inside onclick function. I am kind of confused now. The whole FB code (including – Joe Huang Nov 10 '15 at 16:00
  • The – Konstantinos Kamaropoulos Nov 10 '15 at 16:04
  • So maybe the answer does not address my specific question? Maybe there is actually some other solution? For example, the link should go to a php to execute the code and then redirect to the external link? – Joe Huang Nov 10 '15 at 16:08
  • There is no difference. You will just add the – Konstantinos Kamaropoulos Nov 10 '15 at 16:15
  • If I add – Joe Huang Nov 10 '15 at 16:17
  • Did you read the link I gave you? http://www.w3schools.com/tags/tag_noscript.asp – Konstantinos Kamaropoulos Nov 10 '15 at 16:23
  • "The – Konstantinos Kamaropoulos Nov 10 '15 at 16:24
  • You dont really want this to be executed. Its just in case that the browser can't execute the normal script. – Konstantinos Kamaropoulos Nov 10 '15 at 16:25
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/94735/discussion-between-joe-and-kostas-lifeboy). – Joe Huang Nov 10 '15 at 16:27
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/94736/discussion-between-kostas-lifeboy-and-joe). – Konstantinos Kamaropoulos Nov 10 '15 at 16:42
  • 1
    please reopen this question, it's different than the other question. – Joe Huang Nov 10 '15 at 17:00
  • @KostasLifeboy I wouldn't write a code like that when ` – Joe Huang Nov 11 '15 at 00:33
  • The only solution I can think right now, is to redirect the user to an empty page where the script executes any way and the redirect to the actual page. – Konstantinos Kamaropoulos Nov 11 '15 at 06:39
  • Yes, I already implemented it this way and it works. However, my original question should be asked in my way because there are many other people who use FB conversion code should encounter similar situation, and I am looking for a best solution, not just a solution I came up with myself. – Joe Huang Nov 11 '15 at 07:41
  • I saw at least one person actually rejected your edits with a very good reason. I really don't like the new way of asking this question. It's from a totally different perspective. I really don't care if a browser does not support Javascript when I cannot do it with onclick. – Joe Huang Nov 11 '15 at 07:44
  • 1
    But anyway, to see a solution from this perspective is also ok. Thanks for your engagement & comments. – Joe Huang Nov 11 '15 at 07:53
  • Well, if you would just ask how to run a script when a link is clicked, that would be a duplicate. But the – Konstantinos Kamaropoulos Nov 11 '15 at 12:08
  • 1
    For this problem, there are two ways you can do it. The first is if you set the link as a POST sumbit of a hidden form and redirect the page, and the second solution, as I told above, would be to, instead of the original link, to set the link to a page especially for counting clicks on external links by running the – Konstantinos Kamaropoulos Nov 11 '15 at 12:10

3 Answers3

0

Have you tried using the JavaScript onclick event? For example:

var el; // This is your element pointing to the link you want to handle
el.onclick = function() {
    // Execute your code here, this event is fired before the default behaviour is executed which is to lead the user to the URL
};

If your el has an ID of mylink, then you can simply assign el as

var el = document.getElementById('mylink');

This code becomes even simpler to handle if you're using a JS library like jQuery but for the moment I'm assuming you're not.

Shitiz Garg
  • 604
  • 3
  • 7
0

Here is an edited version of the answer on How to use a link to call JavaScript? 

        // Wait for the page to load first
        window.onload = function() {

          //Get a reference to the link on the page
          // with an id of "mylink"
          var a = document.getElementById("mylink");

          //Set code to run when the link is clicked
          // by assigning a function to "onclick"
          a.onclick = function() {

            // Your code here...

            //If you don't want the link to actually 
            // redirect the browser to another page,
            // "google.com" in our example here, then
            // return false at the end of this block.
            // Note that this also prevents event bubbling,
            // which is probably what we want here, but won't 
            // always be the case.
            return false;
          }
        }
    </script>
    <noscript><img height="1" width="1" alt="" style="display:none" src="https://www.facebook.com/tr?ev=6030151253043&amp;cd[value]=0.00&amp;cd[currency]=USD&amp;noscript=1" /></noscript>
</head>
<body>
    <a id="mylink" href="http://example.com">Link</a>        
</body>
</html>

noscript tag will be used only if the browser does not support JavaScript. And that's why you are not going to put any JavaScript there.

Community
  • 1
  • 1
Konstantinos Kamaropoulos
  • 487
  • 5
  • 20
-2

Yes, you can do it.

put in your link href="javascript:void(0)" and use javascript to redirect.

<a href="javascript:void(0)" onClick="do_and_redirect()">Your link</a>

<script>
function do_and_redirect(){
    //SOME CODE
    //..
    //..
    window.location.href = "http://yourpage.com";
}
</script>
Luca Giardina
  • 478
  • 4
  • 14