使用Javascript或jQuery插入Google Adwords转换跟踪 [英] Inserting Google Adwords Conversion Tracking with Javascript or jQuery

问题描述

我对javascript很新，其中可能存在我的问题。我正在尝试跟踪我们网站上的小部件中发生的AdWords转化。用户填写表单，并且窗口小部件的结果将在相同的div中发布，而不会刷新页面。我遇到的问题是，当我尝试在Google的代码中将appendChild（或附加在jQuery中）两个脚本元素（如下所示）时，页面被重定向到一个空白的Google页面（或者至少通过FireBug看起来像这样） 。
我能够为表单的结果提供回调方法，而这正是我尝试插入AdWords跟踪代码的地方。作为参考，这是Google提供的代码：

I'm pretty new to javascript, and therein probably lies my problem. I'm trying to track AdWords conversions that occur within a widget on our site. The user fills in a form and the result from the widget is published in the same div without a page refresh. The issue I'm having is when I try to appendChild (or append in jQuery) both script elements in Google's code (shown below) the page gets 302 redirected to a blank Google page (or at least that's what it looks like through FireBug). I'm able to provide a callback method for the results of the form, and that's where I'm trying to insert the AdWords tracking code. For reference, this is the code provided by Google:

<script type="text/javascript">
/* <![CDATA[ */
var google_conversion_id = 993834405;
var google_conversion_language = "en";
var google_conversion_format = "3";
var google_conversion_color = "ffffff";
var google_conversion_label = "bSpUCOP9iAIQpevy2QM";
/* ]]> */
</script>
<script type="text/javascript" src="http://www.googleadservices.com/pagead/conversion.js">
</script>
<noscript>
<div style="display:inline;">
<img height="1" width="1" style="border-style:none;" alt="" src="http://www.googleadservices.com/pagead/conversion/993834405/?label=bSpUCOP9iAIQpevy2QM&amp;guid=ON&amp;script=0"/>
</div>
</noscript>

相当标准的东西。所以，我想要做的是使用回调方法（提供）将其插入结果页面。坦率地说，无论我何时尝试使用js或jQuery（无论是在原始页面加载还是在回调中）插入此代码，我都会重定向，因此可能回调位无关紧要，但这就是为什么我不只是将其粘贴到页面的代码。

Pretty standard stuff. So, what I'm trying to do is insert this into the results page using the callback method (which is provided). Frankly, I'm redirected no matter when I try to insert this code using js or jQuery (either on original page load or in the callback) so maybe the callback bit is irrelevant, but it's why I'm not just pasting it into the page's code.

我已经尝试了很多不同的方法来做到这一点，但这就是我现在所拥有的（原谅这种邋。。试图通过这种方式破解我的方式！）：

I've tried a number of different ways to do this, but here's what I currently have (excuse the sloppiness. Just trying to hack my way through this at the moment!):

function matchResultsCallback(data){

    var scriptTag = document.createElement('script');
    scriptTag.type = "text/javascript";
    scriptTag.text = scriptTag.text + "/* <![CDATA[ */\n";
    scriptTag.text = scriptTag.text + "var google_conversion_id \= 993834405\;\n";  
    scriptTag.text = scriptTag.text + "var google_conversion_language \= \"en\"\;\n";   
    scriptTag.text = scriptTag.text + "var google_conversion_format \= \"3\"\;\n";
    scriptTag.text = scriptTag.text + "var google_conversion_color \= \"ffffff\"\;\n";
    scriptTag.text = scriptTag.text + "var google_conversion_label \= \"bSpUCOP9iAIQpevy2QM\"\;\n";
    scriptTag.text = scriptTag.text + "/* ]]> */\n";
    $('body').append(scriptTag);

    $('body').append("<script type\=\"text\/javascript\" src\=\"http://www.googleadservices.com/pagead/conversion.js\" />");
    //I have also tried this bit above using the same method as 'scriptTag' with no luck, this is just the most recent iteration.

    var scriptTag2 = document.createElement('noscript');
    var imgTag = document.createElement('img');
    imgTag.height = 1;
    imgTag.width = 1;
    imgTag.border = 0;
    imgTag.src = "http://www.googleadservices.com/pagead/conversion/993834405/?label=bSpUCOP9iAIQpevy2QM&amp;guid=ON&amp;script=0";

    $('body').append(scriptTag2);
    $('noscript').append(imgTag);
}

真正奇怪的是，当我只插入一个脚本标签时（无论哪一个都没关系，它不会重定向。它只在我尝试插入它们时重定向。

The really odd thing is that when I only insert one of the script tags (it doesn't matter which one), it doesn't redirect. It only redirects when I try to insert both of them.

我还尝试将第一个脚本标记放入原始页面代码中（因为它没有在任何地方进行任何调用，它只是设置变量），只是插入conversions.js文件，它仍然进行重定向。

I've also tried putting the first script tag into the original page code (as it's not making any calls anywhere, it's just setting variables) and just inserting the conversions.js file and it still does the redirect.

如果相关我使用的是Firefox 3.6.13，并且尝试使用jQuery 1.3和1.5包含的代码（在意识到我们使用的是v1.3之后）。

If it's relevant I'm using Firefox 3.6.13, and have tried the included code with both jQuery 1.3 and 1.5 (after realizing we were using v1.3).

我知道我错过了什么！有什么建议？

I know I'm missing something! Any suggestions?

推荐答案

如果您在页面中使用jQuery，为什么不使用 getScript 方法设置完所需后轮询转换跟踪脚本变量？

If you're using jQuery in your pages, why don't you use the getScript method of the same to poll the conversion tracking script after setting the required variables?

这是我通常做的，一旦我从AJAX调用中收到成功响应。

This is what I usually do, once I've received a success response from my AJAX calls.

var google_conversion_id = <Your ID Here>;
var google_conversion_language = "en";
var google_conversion_format = "3";
var google_conversion_color = "ffffff";
var google_conversion_label = "<Your Label here>";
var google_conversion_value = 0;
if (100) {
    google_conversion_value = <Your value here if any>;
}
$jQ.getScript( "http://www.googleadservices.com/pagead/conversion.js" );

这对我来说很合适。如果你想要一个更详细的例子：

This works just fine for me. If you want a more detailed example:

$.ajax({
    async:      true,
    type:       "POST",
    dataType:   "json",
    url:        <Your URL>,
    data:       _data,
    success:    function( json ) {

            // Do something
            // ...

            // Track conversion
            var google_conversion_id = <Your ID Here>;
            var google_conversion_language = "en";
            var google_conversion_format = "3";
            var google_conversion_color = "ffffff";
            var google_conversion_label = "<Your Label here>";
            var google_conversion_value = 0;
            if (100) {
                google_conversion_value = <Your value here if any>;
            }
            $.getScript( "http://www.googleadservices.com/pagead/conversion.js" );

        } // success
});

如果您使用其他库，如Mootools或Prototype，我相信他们有类似的内置方法。这种AFAIK是最干净的方法之一。

If you use other libraries such as Mootools or Prototype, I'm sure they have similar in-built methods. This AFAIK is one of the cleanest approaches.

这篇关于使用Javascript或jQuery插入Google Adwords转换跟踪的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！