I don't know how to create in this function, I need creat the link with the href and rel attributes inside this function, and that in it same function execute the link automatically.
I need to do it, because I have to call it in the getURL of my flash menu, because the getURl don't suport the attribute rel.
I am grateful for your answer friend... but I not yet understood very well.
I must call the function through my onclick to create the link, and on the same function executes the link created automatically.
Explaining:
my link should be only with the onclick, because I want to make a function that creates the link and executes it automatically. Because I will use this function on getURL of the flash that not support to pass the rel attribute.
When this link is created, where in the Document Object Model (created from the HTML document) should the link appear? It's one thing to create a link, but it's not really useful unless you append it to the DOM. For what you are asking, the following steps are recommended:
1) Call the pageURL() function.
2) The pageURL() function creates an <a> element
3) The new <a> element is appended to the DOM (Document Object Model)
4) Call the click() method of the new <a> element.
Maybe this function will help?
Code:
/**
* Creates a link and clicks it
* @param string href The link's href attribute value
* @param string rel The link's rel attribute value
* @return void
*/
function pageURL(href, rel) {
// Create new <a> element
var el = document.createElement("a");
// Assign attributes passed to function
el.rel = rel;
el.href = href;
// Append new link to document
document.getElementsByTagName("body")[0].appendChild(el);
// "click" the link
el.click();
// Nullify the reference to this DOM node to prevent memory leaks
el = null;
}
Can you post the HTML and JavaScript you are using? Remember, the script I posted adds the link to the very end of the web page. I need to see the HTML and JavaScript source code to help you further.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>MY SITE</title>
<link href="css/stle.css" rel="stylesheet" type="text/css" media="screen"/>
<script type="text/javascript" src="js/jquery-1.2.6.pack.js"></script>
<script type="text/javascript" src="js/jquery.history.js"></script>
<script type="text/javascript">
/**
* Creates a link and clicks it
* @param string href The link's href attribute value
* @param string rel The link's rel attribute value
* @return void
*/
function pageURL(href, rel) {
// Create new <a> element
var el = document.createElement("a");
// Assign attributes passed to function
el.rel = rel;
el.href = href;
// Append new link to document
document.getElementsByTagName("body")[0].appendChild(el);
// "click" the link
el.click();
// Nullify the reference to this DOM node to prevent memory leaks
el = null;
}
</script>
<!-- SCRIPT OF THE JQUERY HISTORY -->
<script type="text/javascript">
//hash = url;
// PageLoad function
// This function is called when:
// 1. after calling $.historyInit();
// 2. after calling $.historyLoad();
// 3. after pushing "Go Back" button of a browser
function pageload(hash) {
// hash doesn't contain the first # character.
if(hash) {
// restore ajax loaded state
$("#col-right").load(hash);
} else {
// start page
//$("#load").empty();
$('#col-right').load("home.php"); // abre a pagina inicial ao abrir o site
}
};
//start: function(elementLink){
$(document).ready(function(){
// Initialize history plugin.
// The callback is called at once by present location.hash.
$.historyInit(pageload);
// set onlick event for buttons
// if((elementLink.getAttribute('rel') == 'history')){
$("a[@rel='history']").click(function(){
//
var hash = this.href;
hash = hash.replace(/^.*#/, '');
$("#col-right").html('<div class="tarjaTit"><img src="imagens/ajaxloader.gif"></div>');
// moves to a new page.
// pageload is called at once.
$.historyLoad(hash);
return false;
});
});
</script>
<!-- END -->
<!-- SCRIPT TO INSERT FLASH
<script type="text/javascript">
var flashvars = {
page: "<? echo page; ?>"
};
var params = {
scale: "noscale",
salign: "t",
wmode: "transparent"
};
var attributes = {
};
swfobject.embedSWF("flash/menu.swf", "menu-flash", "210", "211", "8", "flash/expressInstall.swf", flashvars, params, attributes);
</script>
</head>
<body>
<div id="content">
<div id="col-left">
<a href="#" onclick="pageURL('#home.php','history');">HOME</a> |
<a href="#" onclick="pageURL('#contact.php','history');">CONTACT</a>
</div>
<div id="menu-flash"><!-- Here goes the flash menu --></div>
</div>
<div id="col-right">
<!-- Here goes the content of the other pages -->
</div>
</body>
</html>
It is my code:
Explaining: My original link isn't <a href="#" onclick="pageURL('#home.php','history');">HOME</a> but:
<a href="#home.php" rel="history">
The rel attribute is necesssary to the jQuery history function. So you can see, I will use the function pageURL in the flash that don't support the attribute rel of the link.
I need tha this function when clicked in the flash button, create a the link and execute it, opening the page with the jQuery history.
Bookmarks