Include scripts before <body> php - php

Is there a way to inject scripts into the page before the <body> tag in php? I've seen some examples on how to do this with jquery, but jquery causes parts of my site not to function properly therefore I need a php code so I can selectively inject scripts before the opening tag of my page.
ie.
.....
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="jquery.internads.js"></script>
<script>
$(document).ready(function(){
// Call Intern Ads
$().tcInternAds({
title: "Support Our Sponsors!",
url: "adpage.html",
timeout: 10,
deplay: 0,
wait: 0,
closeable: true
});
});
</script>
<body>
<div class="xxxxx">
...............</div>
I would like to be able to use php if possible, so I can include the code in my template files where I need the scripts to be called while avoiding global inclusion.
Can anyone help with this?
best,
Mike

Put your contents in index.php (or whatever it's called).
It should look like this:
<?php
...phpcode...
?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="jquery.internads.js"></script>
<script>
...
</script>
<body>
<div class="xxxxx">
<?php
another php code
?>
</div>

Wouldn't simply placing it within the <head> work?
<head>
.....
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="jquery.internads.js"></script>
<script>
$(window).load()(function(){
// Call Intern Ads
$().tcInternAds({
title: "Support Our Sponsors!",
url: "adpage.html",
timeout: 10,
deplay: 0,
wait: 0,
closeable: true
});
});
</script>
</head>
<body>
<div class="xxxxx">
...............</div>

I have found a solution to my problem without having to inject or replace head code. The problem is that my site includes mootools and jquery is conflicting with it. I resolved the issue by using jQuery noConflict which defines a namespace to use and thus resolves the issue by using a custom variable rather than the dollar $.
Here is my working solution to workaround jquery/mootools conflict.
<link href="/internAds.css" rel="stylesheet" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="/jquery.internads.js"></script>
<script>
var $j = jQuery.noConflict();
$j(document).ready(function(){
// Call Intern Ads
$j().tcInternAds({
title: "Support Our Sponsors!",
url: "/adpage.html",
timeout: 15,
deplay: 0,
wait: 5,
closeable: false
});
});
</script>
I appreciate everyone's time, I am not sure how I overlooked the conflict.
best,

Related

onbeforeunload doesn't seem to always be trigerred

Here's a minimum example -
index.php
<?php
$count = file_get_contents("count.txt") + 0;
file_put_contents("$count.txt [loaded]", '');
file_put_contents("count.txt", $count + 1);
?>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script src="jquery-1.10.2.min.js"></script>
</head>
<body>
<main>
<p> hi there </p>
</main>
<script type="text/javascript">
var id = "<?php echo $count; ?>";
</script>
<script src="script.js"></script>
</body>
</html>
script.js
$(document).ready(function ()
{
$(window).bind('beforeunload', function () {
$.post("unloader.php", { id : id });
});
});
unloader.php
<?php
file_put_contents("$_POST[id] [unloaded]", '');
When I open the webpage, a file is created with the count number as its name.
When I close the tab jquery requests unloader.php which is just a standalone script that creates a file with the count number as its name too.
Sometimes it works, sometimes it doesn't.
I mean the opening file is always created. But sometimes the file which has to be created on closing is not made.
Any idea where the issue occured ?
You can't (reliably) make AJAX calls when unloading the page. Because it's being unloaded, anything still in progress will be dropped.
If the browser's fast enough with the AJAX call (or the server's slow enough in responding to the new page load) then you should see a result, but it is not at all reliable.

jQuery post() to php page

I'm learning php/javascript so don't smile...
I try from page1.php to post 3 variables to page2.php.
I'm not sure what's wrong...
Here is the code (simplified mode):
page1.php
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript">
window.onload = post_text;
function post_text() {
test1="111";
test2="222";
test3="333";
$.post("page2.php", { test1:test1 , test2:test2, test3=test3 });
}
</script>
</body>
</html>
page2.php
<?php
$a=$_POST['test1'];
$b=$_POST['test2'];
$c=$_POST['test3'];
echo $a.$b.$c;
?>
$.post("page2.php", { test1:test1 , test2:test2, test3:test3 });
Since you are learning, you might try to isolate problems by writing shorter chunks of code and seeing if they work first. In this case your first problem is an ordinary typo (test3=test3, instead of test3: test3) so your whole JS does not parse. You should be seeing the relevant error message in the firebug console (or chrome console).

How to output large HTML chunk using JavaScript?

hi all i am trying to output a large html chunk that holds opening and closing javascript tags. The javascript included is a jw player script and its mixed with javascript dynamic variable +url and php variable $Title. i tried document.write but the player didn't show up in the browser !instead it output part of the document.write statements! could you guys help me fix this issue ? Thanks in advance.
document.write("<html>");
document.write("<head>");
document.write("<meta http-equiv="Content-Type" content="text/html; charset=utf-8">");
document.write("</head>");
document.write("<br>");
document.write("Title:<?php echo $Title;?> <script type='text/javascript' src='./jwplayer.js'></script>");
document.write("<div id='mediaspace'>This text will be replaced</div>");
document.write("<script type='text/javascript'>");
document.write(" jwplayer('mediaspace').setup({");
document.write("'flashplayer': './player.swf',");
document.write("'file': + url,");
document.write("'autostart': 'true',");
document.write("'controlbar': 'bottom',");
document.write("'width': '470',");
document.write("'height': '320'");
document.write("});");
document.write("</script>");
document.write("</html>");
PHP written into the document with JavaScript will not run. PHP is evaluated before a document is received by the browser. JavaScript runs after.
As far as writing out a <script> element dynamically without breaking the current script, one option is to escape the forward slash, i.e.
document.write("<\/script>");
But, is there a reason JS has to output this code? In addition to the above problems, document.write is a bit outdated, and can become problematic when writing scripts. It would be a lot cleaner to host a PHP page like:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
Title: <?php echo $Title;?>
<script type='text/javascript' src='./jwplayer.js'></script>
<div id='mediaspace'>This text will be replaced</div>
<script type='text/javascript'>
jwplayer('mediaspace').setup({
'flashplayer': './player.swf',
'file': url,// assumes 'url' exists in the global namespace!
'autostart': 'true',
'controlbar': 'bottom',
'width': '470',
'height': '320'
});
</script>
</body>
</html>
Note <body> tag added.
Not sure what you're trying to do but document.getElementById("idtag").innerHTML = "Data"; will fill in the content between the tags of the element with the selected id.
Example:
<div id="dataplaceholder"></div>
<script type="text/javascript">
document.getElementById("dataplaceholder").innerHTML = "<h2>Hello World!</h2>";
</script>

Jquery : .replace ® not functioning

Why doesn't this work?
<script type="text/javascript" src="js/jquery-1.8.1.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("body").html($("body").html().replace(/®/g, '<sup>®</sup>').replace(/®/g, '<sup>®</sup>').replace("\u00AE" , '<sup>®</sup>'));
};
);
</script>
Firebug in Firefox gives this in the console:
"SyntaxError: missing ) after argument list"
But, this breaks the Wordpress entirely...
<script type="text/javascript">
$(document).ready(function() {
$("body").html($("body").html().replace(/®/g, '<sup>®</sup>').replace(/®/g, '<sup>®</sup>').replace("\u00AE" , '<sup>®</sup>'));
}
);
</script>
The basic of this function is to find every single registration mark in the body, and replace it with "®"
If this function is capable in PHP as well, that's preferable.
It seemed like the best thing to do was to go into the database and just run a sql query to replace all registration marks and wrap it in "" tags.
However, this did work on individual elements. (Like adeneo said, it's not a good idea to replace the entire site HTML... which broke the site for me)
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"> </script>
<script type="text/javascript">
$(document).ready(function() {
$("h1").html(
$("h1").html()
.replace("®", "<sup>®</sup>")
.replace(/®/g, '<sup>®</sup>')
.replace(/®/g, '<sup>®</sup>')
.replace("\u00AE" , '<sup>®</sup>')
);
});
</script>

accessing a PHP object (in another file) within a jquery code. Help

I have a json object in a PHP file and I want to access it from a JQuery.js file, which both located in an index.php page.
Do you have an idea how to do that ?
index.php
<?php
include('theFileThatContainsJson.php'); // say it's $json
?>
<html>
<head>
<script language="javascript" src="jquery.js" type="text/javascript"></script>
</head>
<body>
.............
</body>
</html>
and here, what we have in jquery.js file, you can see my work (which doesn't work ;) ):
$.getJSON(<?php echo '$json'; ?>, function(data){ .... }
How to solve the puzzle <<< at least for me at this moment :) ?
One way (nasty!) would be to do something like this..
<script language="javascript" src="jquery.js.php?data=<?php echo base64_encode($json) ?>" type="text/javascript"></script>
.. and on your jquery.js.php file:
$.getJSON(<?php echo base64_decode($_GET['data']) ?>, function(data) { ... });
Of course, this is terrible practice and shouldn't really be done.. The best ways could include:
Have theFileThatContainsJson.php to simply echo the JSON, and have jquery.js just do an AJAX request to get the data
Have theFileThatContainsJson.php actually print out a <script></script> tag that contains a Javascript variable which you can use
if json not big:
$.getJSON('<?php echo '$json'; ?>', function(data){ .... }
or even
$.getJSON('<?php include('theFileThatContainsJson.php'); ?>', function(data){ .... }
in second case theFileThatContainsJson.php should echo that json.
in both cases should be in body of page
anyway I would not suggest to make it like that (use ajax for example)

Categories