Problem with simulating a link.click

[Xu, Qian]

Hello All,

I have some problem by simulating a link click using javascript.
The webpage uses a js-library named interface (jQuery like)
------------------------------
<a id="foo" href="#">Try try try</a>
$('#foo').click(function(){
$('ul',this.parentNode).BlindToggleVertically(500);
this.blur();
return false;
});
------------------------------

I tried first:
------------------------------
var elem = document.getElementById('foo');
elem.focus();
elem.click(); // does not work, and js becomes blocked
------------------------------

And then I tried:
------------------------------
var elem = document.getElementById('foo');
elem.focus();
if (elem.onclick || elem.onclick() !== false) {
alert('passed');
} else {
alert('failed'); // Program goes here :-(
}
------------------------------

Is it possible to simulate a link click?

I have an idea:
1. Retrieve the coordinate of the link.
2a. Simulate a mouse click at this position, or
2b. Simulate a keystroke "ENTER".

But I have no idea how to implement this. Can someone help me?

Thanks in advance ^^)

 

[RobG]

Hello All,

I have some problem by simulating a link click using javascript.
The webpage uses a js-library named interface (jQuery like)

I don't know the library, but if it's "jQuery-like", then its $
function will return a native object, not the element itself. When
you call its click method, it will attach a listener to the element's
*onclick* property.

[...]

I tried first:

That will only work with inline listeners, it won't work with
dynamically added listeners. Since the listener is on the onclick
property, you need to use:

elem.onclick();

------------------------------

And then I tried:
------------------------------
var elem = document.getElementById('foo');
elem.focus();
if (elem.onclick || elem.onclick() !== false) {
   alert('passed');} else {

   alert('failed'); // Program goes here :-(}

Because the handler was added dynamically.

Is it possible to simulate a link click?

Yes, using dispatchEvent for W3C compatible browsers, or fireEvent for
those that use the IE model. But it is not well supported.

I have an idea:
1. Retrieve the coordinate of the link.
2a. Simulate a mouse click at this position, or
2b. Simulate a keystroke "ENTER".

The event must be dispatched to the correct DOM element, you can't do
it using the above method.

But I have no idea how to implement this. Can someone help me?

Search this group for "How to trigger event programmatically?"
<URL:
http://groups.google.com.au/group/c...k=gst&q=dispatchEvent&rnum=2#98cea9cdf065a524

 

[SAM]

Xu, Qian a écrit :

Hello All,

I have some problem by simulating a link click using javascript.
The webpage uses a js-library named interface (jQuery like)
------------------------------
<a id="foo" href="#">Try try try</a>
$('#foo').click(function(){
$('ul',this.parentNode).BlindToggleVertically(500);
this.blur();
return false;
});

The JS function click() works only with buttons of forms
(ie : submit)

Is it possible to simulate a link click?

var elem = document.getElementById('foo');
if (elem.href) location = elem.href;


or (tested in Fx, Safari, Opera) :

var elem = document.getElementById('foo');
if(elem.onclick) elem.onclick();

 

[Xu, Qian]

Hello All,

I have some problem by simulating a link click using javascript.
The webpage uses a js-library named interface (jQuery like)

I don't know the library, but if it's "jQuery-like", then its $
function will return a native object, not the element itself. When
you call its click method, it will attach a listener to the element's
*onclick* property.

[...]

I tried first:

That will only work with inline listeners, it won't work with
dynamically added listeners. Since the listener is on the onclick
property, you need to use:

elem.onclick();

------------------------------

And then I tried:
------------------------------
var elem = document.getElementById('foo');
elem.focus();
if (elem.onclick || elem.onclick() !== false) {
alert('passed');} else {

alert('failed'); // Program goes here :-(}

Because the handler was added dynamically.

Is it possible to simulate a link click?

Yes, using dispatchEvent for W3C compatible browsers, or fireEvent for
those that use the IE model. But it is not well supported.

I have an idea:
1. Retrieve the coordinate of the link.
2a. Simulate a mouse click at this position, or
2b. Simulate a keystroke "ENTER".

The event must be dispatched to the correct DOM element, you can't do
it using the above method.

But I have no idea how to implement this. Can someone help me?

Search this group for "How to trigger event programmatically?"
<URL:
http://groups.google.com.au/group/c...k=gst&q=dispatchEvent&rnum=2#98cea9cdf065a524

Thanks you both.

fireEvent() and dispatchEvent() do help.
But they do not work with normal link, do they?

Currently I am using the following code:
------------------------------------------------
elem.target = '';
elem.focus();
// attempt 1
try
{
if (elem.click()) {
return true;
}
}
catch(e) { /* This element does not support click */ }
// attempt 2
if (document.createEvent)
{
var evtObj = document.createEvent('MouseEvents');
if (evtObj && elem.dispatchEvent && evtObj.initMouseEvent)
{
evtObj.initMouseEvent(
'click',
true, true, // Click events bubble and they can be cancelled
document.defaultView, // Use the default view
1, // Just a single click
0, 0, 0, 0, // Don't bother with co-ordinates
false, false, false, false, // Don't apply any key modifiers
0, // 0 - left, 1 - middle, 2 - right
null); // Click events don't have any targets other than
// the recipient of the click
return elem.dispatchEvent(evtObj);
}
}
else if (document.createEventObject)
{
return elem.fireEvent('onclick');
}
// attempt 3
if (elem.href)
{
location = elem.href;
return true;
}
return false;
-----------------------------------------------------------

 

[RobG]

Thanks you both.

fireEvent() and dispatchEvent() do help.
But they do not work with normal link, do they?

By "work" I guess you mean follow the link, the short answer is no,
though Firefox v2 and earlier did and Safari 3 still does. IE never
did.

Currently I am using the following code:
------------------------------------------------
elem.target = '';
elem.focus();
// attempt 1
try
{
   if (elem.click()) {

I don't see the point of that, will calling the click function always
return true (or at least non-falsey)?

     return true;
   }}

catch(e) { /* This element does not support click */ }
// attempt 2
if (document.createEvent)

As you know, at least some browsers that support createEvent will not
follow the link, so this seems pointless.

[...]

else if (document.createEventObject)

And IE doesn't follow the link either...

[...]

if (elem.href)
{
   location = elem.href;
   return true;}

return false;

If that's what you want to do, why not just do it and forget the
rest? It will work much more reliably in more browsers than anything
else that's been posted.

 

[Xu, Qian]

[...]

By "work" I guess you mean follow the link, the short answer is no,
though Firefox v2 and earlier did and Safari 3 still does. IE never
did.

Yes, I mean to simulate a manual link click. It is more than to follow a
link.

I don't see the point of that, will calling the click function always
return true (or at least non-falsey)?

Yes, you are right. I did not know. But a try-catch-block is useful.
Once an element does not support click() method, program will not be abort.

As you know, at least some browsers that support createEvent will not
follow the link, so this seems pointless.

[...]

else if (document.createEventObject)

And IE doesn't follow the link either...

No, I try to fire onClick event.

[...]

If that's what you want to do, why not just do it and forget the
rest? It will work much more reliably in more browsers than anything
else that's been posted.

I want to simulate a user link click without the knowledge, how the html
looks like. It should work generally for all kind of links:
<a href="somewhere.htm">Normal Link</a>
<a onClick="alert(123)">OnClick Only</a>
<a href="#" onClick="a_function()">OnClick with an indirect link</a>
<a href="#" id="aaa">The onClick event of this link will be hooked
dynamically</a>
.... and more variants, that I do not know.