跨域 Ajax 的动态脚本标记不起作用

Question

I'm trying to use the dynamic script tag for cross-domain ajax, since I can't use PHP on the website where it's needed (we're using a CMS, so we can use HTML/Javascript, but no PHP).

The thing is, both scripts work well (javascript and php) on their own, meaning the script tag is well added, and the PHP scripts, when launched on its own, works as needed.

But it looks like the GET request is not processed when the script tag is added (using.appendChild).

Is there a way to make it work?

Here is the code, simplified:

PHP:

$email = $_GET['email'];
$source = $_GET['source'];
echo 'callback({"value": "true"});';
// sending the email through php

Javascript:

function dlPj() {
  // Prompt the user for his email
  var email = prompt('Enter your email', 'your email');
  // If the script tag already exists, delete it
  if (document.getElementById('script-pj') != null) {
    var script_pj = document.getElementById('script-pj');
    document.getElementsByTagName("head")[0].removeChild(script_pj);
  }
  // Create the script tag to call the PHP script
  var s = document.createElement('script');
  s.type = 'txt/javascript';
  s.id = 'script-pj';

  s.src = 'http://www.something.com/bel/pj.php?';
  s.src += 'email=' + email;
  s.src += '&source=' + document.location.href + '?';

  document.getElementsByTagName("head")[0].appendChild(s);
}

function callback(value) {
  if (value == null) {
    alert('error');
  }
  else {
    if (value.value == "true") {
      alert('working');
    }
    else {
      alert('not working');
    }
  }
}

Help greatly appreciated.

Edit: problem solved. The problem was the following: I added an onclick event on an A tag, so that I could get some information about a user before he downloads an attached file. So I left it at return true;, so that he could download the file after filling in the form. Changing the onclick event to "dlPj(); return false;" solves the problem.

Answer 1

Try this, it works in chrome:

  var email = prompt('Enter your email', 'email@company.com');
  // If the script tag already exists, delete it
  if (document.getElementById('script-pj') != null) {
    var script_pj = document.getElementById('script-pj');
    document.getElementsByTagName("head")[0].removeChild(script_pj);
  }
  // Create the script tag to call the PHP script
  var s = document.createElement('SCRIPT');
  s.id = 'script-pj';
  s.src = 'http://www.something.com/bel/pj.php?' +
                'email=' + encodeURIComponent(email) + 
                '&source=' + encodeURIComponent(document.location.href);

  document.getElementsByTagName("head")[0].appendChild(s);

Answer 2

Alright, so that this follows correctly stackoverflow's workflow, there is the answer.

The problem was the following: I added an onclick event on an A tag, so that I could get some information about a user before he downloads an attached file. So I left it at return true;, so that he could download the file after filling in the form. Changing the onclick event to "dlPj(); return false;" solves the problem.