Solved

jscript: adding onClick events for the links

Posted on 2007-11-25
21
1,077 Views
Last Modified: 2011-09-20
Hi,

I need to add onClick events and remove href values for All links in the document. here is a simple code:

<script type="text/javascript">
<!--
function ajaxLinks () {
for (var i=0;i < document.links.length;i++) {
if(document.links[i].href.substr(0,<?php echo strlen($mosConfig_live_site)?>)=="<?php echo $mosConfig_live_site ?>"||document.links[i].href.substr(0,9)=="index.php:"){
//document.links[i].href = "javascript:xajax_multiply('index2.php"+document.links[i].href.substring(<?php echo strlen($mosConfig_live_site)+10?>)+"')";
document.links[i].onclick = "xajax_multiply('index2.php"+document.links[i].href.substring(<?php echo strlen($mosConfig_live_site)+10?>)+"')";
document.links[i].href = "#";
}}}
ajaxLinks();
-->
</script>
The problem is that id does not add the onClick event, but only makes href="#"

The first command (commented), i.e.

//document.links[i].href = "javascript:xajax_multiplle......

works fine.

What is wrong here?

Pleas, help
0
Comment
Question by:andy7789
  • 10
  • 9
  • 2
21 Comments
 
LVL 17

Expert Comment

by:gops1
ID: 20347670
do it this way:

document.links[i].onclick = function(){
                 "xajax_multiply('index2.php"+document.links[i].href.substring(<?php echo strlen($mosConfig_live_site)+10?>)+"')";
}
0
 

Author Comment

by:andy7789
ID: 20347743
still it returns a mess like

index2.php"+document.links[i].href.substring(34)+"

as an argument - we should check all "" and ' here...
0
 

Author Comment

by:andy7789
ID: 20347821
I am still getting troubles with this... this is the final code:

<script type="text/javascript">
<!--
function ajaxLinks () {
for (var i=0;i < document.links.length;i++) {
if(document.links[i].href.substr(0,<?php echo strlen($mosConfig_live_site)?>)=="<?php echo $mosConfig_live_site ?>"||document.links[i].href.substr(0,9)=="index.php:"){
var target = 'index2.php'+document.links[i].href.substring(<?php echo strlen($mosConfig_live_site)+10?>);
document.links[i].onclick = xajax_multiply(target);
document.links[i].href = "#";
}}}
ajaxLinks();
-->
</script>

INstead of adding onClick event to the link, it keeps calling function xajax_multiply in cycle. When the cycle is over, it does not add onClick event anyway

Any ideas?
0
 
LVL 17

Expert Comment

by:gops1
ID: 20348019
call ajaxLinks() onload of body.

window.onload=function(){
           ajaxLinks();
}
0
 

Author Comment

by:andy7789
ID: 20348038
it looks as i cannot attach a new event to the link element. Since I am using a mootools library, I have added it like

function ajaxLinks () {
var target;
for (var i=0;i < document.links.length;i++) {
if(document.links[i].href.substr(0,<?php echo strlen($mosConfig_live_site)?>)=="<?php echo $mosConfig_live_site ?>"||document.links[i].href.substr(0,9)=="index.php:"){
target = 'index2.php'+document.links[i].href.substring(<?php echo strlen($mosConfig_live_site)+10?>);
//document.links[i].onclick = xajax_multiply(target);
document.links[i].addEvent('click', function(){xajax_multiply(target)});
document.links[i].href = "#";
}}}

It works, BUT adds ONLY the 1st link element, i.e. ALL the alaments have exactly the same xajax_multiply argument.

I just cannot figure out what is wrong with the cycle

Pls, have a look, if you spot something here
0
 
LVL 17

Expert Comment

by:gops1
ID: 20348064
I have a little knowledge regarding php
it is got to do with your php logic. Once the php is rendered, this value <?php echo strlen($mosConfig_live_site)+10?>, it will be the same through out.  It will pickup only the last value.


0
 

Author Comment

by:andy7789
ID: 20348136
php is fine here, because it takes a substring, i.e.

document.links[i].href.substring(value)

anyway, when I make alert(target), it returns all correct and different outputs, but does not assign correct onClick values.
0
 

Author Comment

by:andy7789
ID: 20348239
It always adds the LAST link value...
0
 
LVL 17

Expert Comment

by:gops1
ID: 20348246
This is what I am trying to tell you. Whatever is the last value that is going to be added up to all links. You need to loop them seperately
0
 

Author Comment

by:andy7789
ID: 20348266
Look, it is not like this (even it returns the correct alert values (target var).

The idea of the whole logic is as follows

1) document.links[].href returns the values like http://www.mydomain.com/index.php?com_var etc etc etc
2) I have to include onClick arguments like index2.php?com_var - the same string
3) php function finds the length of http://www...com, next adds the length of index.php and extracts it from the sgtring. Next the index2.php is added to the beginning of the string

It works perfectly when I alert all the target values, but does not add them to the onClick event
0
How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

 
LVL 17

Expert Comment

by:gops1
ID: 20348280
did you try replacing this line:

document.links[i].addEvent('click', function(){xajax_multiply(target)});

with this:

document.links[i].onclick=function(){
        xajax_multiply(target);
}
0
 

Author Comment

by:andy7789
ID: 20348296
yes i did - exactly the same. I even added an alert of the same target like

document.links[i].onclick=function(){
        xajax_multiply(target);
            mySpinner();
            alert(target);
}

Clicking on the link triggers the same alert of the same (last!) link
0
 
LVL 17

Expert Comment

by:gops1
ID: 20348366
Then check for "if" condition is getting satisfied or not
0
 
LVL 17

Accepted Solution

by:
gops1 earned 500 total points
ID: 20348387
ok try it this way:
function ajaxLinks () {
 

	for (var i=0;i < document.links.length;i++) {

		if(document.links[i].href.substr(0,<?php echo strlen($mosConfig_live_site)?>)=="<?php echo $mosConfig_live_site ?>"||document.links[i].href.substr(0,9)=="index.php:"){

			document.links[i].onclick=function(){

				var target='index2.php'+this.href.substring(<?php echo strlen($mosConfig_live_site)+10?>);

				xajax_multiply(target);

				mySpinner();

				alert(target);

			}

			document.links[i].href = "#";

		}

	}

}

Open in new window

0
 

Author Comment

by:andy7789
ID: 20348401
what's the difference? it looks as my code. You only placed Var target inside
0
 
LVL 17

Expert Comment

by:gops1
ID: 20348414
See before target was a global variable, so if once target gets the value then throughout the program the target will have the same value. Now if you place it inside at least we can be sure of that target gets a new value always else nothing. The other thing I have change is usage of this.href that us because according to you href is aways assigned the correct values
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 20348962
What is xajax_multiply going to do with this code???

xajax_multiply('index2.php"+document.links[i].href.substring(<?php echo strlen($mosConfig_live_site)+10?>)+"')

0
 
LVL 17

Expert Comment

by:gops1
ID: 20349090
I guess Andy has open another question with the same issue.

http://www.experts-exchange.com/Programming/Languages/Scripting/JScript/Q_22981762.html

Probably you can close this one.
0
 

Author Comment

by:andy7789
ID: 20349122
mplungjan,

this is a generated xjax function (see http://xajaxproject.org)

Yes, i have opened another question and the zvonko's solution works fine:


Still, i cannot understand, why adding

document.links[i].href = .....some function with i as an argument works fine, but

document.links[i].onClick = some function - does not work.
<script type="text/javascript">

<!--

function ajaxLinks () {

  var target;

  var lnk = document.links;

  //if(lnk[i].href.match(liveSite)||lnk[i].href.match("index.php")||lnk[i].href.match(".htm"))

  var liveSite = "<?php echo $mosConfig_live_site ?>";

  for (var i=0;i<lnk.length;i++){

    if(lnk[i].href.match("option=com_content")||lnk[i].href.match("option=com_contact")||lnk[i].href.match("option=com_alphacontent")||lnk[i].href.match("option=com_joomap")){

      var lnkPar = lnk[i].href.split("?");

      if(!lnkPar[1]) lnkPar[1]="?";

      target = 'index2.php?'+lnkPar[1];

      lnk[i].onclick = new Function("target='"+target+"';xajax_multiply(target);mySpinner();");

      lnk[i].href = "#";

    }

  }

}

ajaxLinks();
 

-->

</script>

Open in new window

0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 20349163
href is a string
onclick is an event handler and  needs a function
0
 

Author Comment

by:andy7789
ID: 20349197
yes, it is quite clear, but the way i tried it did no work:

document.links[i].addEvent('click', function(){xajax_multiply(target)}); // via mootools

or

document.links[i].onclick=function(){
        xajax_multiply(target);
}

both of those codes do not work
0

Featured Post

Find Ransomware Secrets With All-Source Analysis

Ransomware has become a major concern for organizations; its prevalence has grown due to past successes achieved by threat actors. While each ransomware variant is different, we’ve seen some common tactics and trends used among the authors of the malware.

Join & Write a Comment

Introduction HTML checkboxes provide the perfect way for a web developer to receive client input when the client's options might be none, one or many.  But the PHP code for processing the checkboxes can be confusing at first.  What if a checkbox is…
In Part 1 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7849-Hex-Maze.html) we covered the hexagonal maze basics -- how the cells are represented in a JavaScript array and how the maze is displayed.  In this part, we'…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

705 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now