dov22
asked on
Generate MouseDown event for Select cross browser
What is the correct manner of generating (creating) a mouse down event (as if user actually pressed the mouse button) within the area of a select popup menu (the FORM style select, not DHTML)?
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Thank you for the answers.... it may be that it is impossible to generate an event programatically... that is the aim... seems that some may have solved it (like dynAPI) but I am not a JavaScript expert, and would like to vertify this... the aim in this case, is to cause the Select Popup (form select) to showup, as if a user clicked the mouse button.
Try this....it answered my question a few weeks back and it might be what you are looking for...
<html>
<head>
<script language=javascript>
function fnShowHide(param)
{
//alert(document.all[param
document.all.n.style.visib
document.all.one.style.vis
document.all.two.style.vis
document.all.three.style.v
document.all.four.style.vi
document.all[param].style.
}
</script>
</head>
<body>
<center>
<form name=form><select onChange="fnShowHide(this.
<option value="n">---Choose one---</option>
<option value="one">Alabama</optio
<option value="two">Alaska</option
<option value="three">Arizona</opt
<option value="four">Arkansas</opt
</select></form>
<br><br>
<div id=n style="visibility: visible;position: absolute"></div>
<div id=one style="visibility: hidden;background-color: red;position: absolute">I am 1st.
</div>
<div id=two style="visibility: hidden;background-color: green;position: absolute">
I am 2nd!
</div>
<div id=three style="visibility: hidden;background-color: blue;position: absolute">
I am the 3rd!
</div>
<div id=four style="visibility: hidden;background-color: yellow;position: absolute">
I am the 4th!
</div>
</center>
</body>
</html>
OR
you could try using the <a> with an onMouseDown handler like this...
<a href="Services.htm" onMouseOver="document.imag
onMouseDown="document.imag
onMouseUp="document.images
onMouseOut="document.image
<img border="0" name="servButton" src="images/Services.gif" ALT="Services Offered" width="120" height="40"></a>
<html>
<head>
<script language=javascript>
function fnShowHide(param)
{
//alert(document.all[param
document.all.n.style.visib
document.all.one.style.vis
document.all.two.style.vis
document.all.three.style.v
document.all.four.style.vi
document.all[param].style.
}
</script>
</head>
<body>
<center>
<form name=form><select onChange="fnShowHide(this.
<option value="n">---Choose one---</option>
<option value="one">Alabama</optio
<option value="two">Alaska</option
<option value="three">Arizona</opt
<option value="four">Arkansas</opt
</select></form>
<br><br>
<div id=n style="visibility: visible;position: absolute"></div>
<div id=one style="visibility: hidden;background-color: red;position: absolute">I am 1st.
</div>
<div id=two style="visibility: hidden;background-color: green;position: absolute">
I am 2nd!
</div>
<div id=three style="visibility: hidden;background-color: blue;position: absolute">
I am the 3rd!
</div>
<div id=four style="visibility: hidden;background-color: yellow;position: absolute">
I am the 4th!
</div>
</center>
</body>
</html>
OR
you could try using the <a> with an onMouseDown handler like this...
<a href="Services.htm" onMouseOver="document.imag
onMouseDown="document.imag
onMouseUp="document.images
onMouseOut="document.image
<img border="0" name="servButton" src="images/Services.gif" ALT="Services Offered" width="120" height="40"></a>
ASKER
Thanks for the DHTML sample... There are many solutions via DHTML... need one that does not rely on DHTML. The result is to be an actual mouse down event (as if the user clicked the mouse) via JavaScript, or some other Browser script (cross browser is still important)
As far as I know, you cannot do this. I had thought you were looking to fire off an event the onclick event that a select would have if you user had clicked on it, but what you want is the ability to make that select box open and show it's options WITHOUT the user clicking the down arrow.
You can set the focus to the select box, or even change the option that is selected, but I think mimicing the user hitting the downarrow is beyond the capabilities of JavaScript.
Considering your want a crossbrowser solution, I really think you're on a wild goose chase.
What are you trying to accomplish exactly? We may be able to help you find a suitable alternative...
You can set the focus to the select box, or even change the option that is selected, but I think mimicing the user hitting the downarrow is beyond the capabilities of JavaScript.
Considering your want a crossbrowser solution, I really think you're on a wild goose chase.
What are you trying to accomplish exactly? We may be able to help you find a suitable alternative...
ASKER
Just about every OS is able to generate events (not simply respond to them) including mouse events. The browser is not a complete OS but it has some inclination towards being such, and thought this may be included.
I have a number of areas where I'd like to be able to generate mousedown or keydown events... and yes, have the select box open and show its options, is the goal here.
This may be a chase without a positive result, yet it is worth finding out if browser control in this manner is possible.
I have a number of areas where I'd like to be able to generate mousedown or keydown events... and yes, have the select box open and show its options, is the goal here.
This may be a chase without a positive result, yet it is worth finding out if browser control in this manner is possible.
The browser cannot generate mouse nor keyboard. It can call functions that would would be linked to these events such as onmousedown, or onkeyup, but it is not possible to generate these actual events as the OS would do them using standard web techniques. You may be able to get away with it in activeX, or possibly through Java. If a script could generate mouse of keyboard events, what would stop someone from rebooting, or reformatting your computer by a series of keystrokes and or mouse clicks?
The following are all the events,properties,and methods that IE supports for the SELECT object. If you don't see what you're looking for in this list, then you cannot do it:
Object Name testSelect
language
scrollHeight 22
isTextEdit false
currentStyle [object]
document [object]
onmouseup null
oncontextmenu null
isMultiLine true
clientHeight 22
onrowexit null
onbeforepaste null
onactivate null
scrollLeft 0
lang
onmousemove null
onmove null
onselectstart null
parentTextEdit [object]
oncontrolselect null
canHaveHTML false
onkeypress null
oncut null
onrowenter null
onmousedown null
onpaste null
className
id
onreadystatechange null
onbeforedeactivate null
hideFocus false
dir
isContentEditable false
onkeydown null
clientWidth 26
onlosecapture null
parentElement [object]
ondrag null
ondragstart null
oncellchange null
recordNumber null
onfilterchange null
onrowsinserted null
ondatasetcomplete null
ondragenter null
onblur null
onresizeend null
onerrorupdate null
onbeforecopy null
ondblclick null
scopeName HTML
onkeyup null
onresizestart null
onmouseover null
onmouseleave null
outerText
innerText
onmoveend null
tagName SELECT
title
offsetWidth 26
onresize null
contentEditable inherit
runtimeStyle [object]
filters [object]
ondrop null
onpage null
onrowsdelete null
tagUrn
offsetLeft 29
clientTop 0
style [object]
clientLeft 0
ondatasetchanged null
canHaveChildren true
ondeactivate null
isDisabled false
onpropertychange null
ondragover null
onhelp null
ondragend null
onbeforeeditfocus null
disabled false
onfocus null
behaviorUrns [object]
accessKey
onscroll null
onbeforecut null
readyState complete
all [object]
sourceIndex 9
onclick null
scrollTop 0
oncopy null
tabIndex 0
onbeforeupdate null
outerHTML
innerHTML
ondataavailable null
offsetHeight 22
onmovestart null
onmouseout null
scrollWidth 26
offsetTop 17
onmouseenter null
onlayoutcomplete null
offsetParent [object]
onafterupdate null
ondragleave null
children [object]
onchange null
nodeValue null
firstChild null
value
length 0
dataFormatAs [Unable to display]
lastChild null
nodeName SELECT
dataFld [Unable to display]
attributes [object]
parentNode [object]
options [object]
multiple false
nodeType 1
dataSrc [Unable to display]
previousSibling [object]
form [object]
childNodes [object]
size 0
nextSibling [object]
type select-one
name testSelect
selectedIndex -1
The following are all the events,properties,and methods that IE supports for the SELECT object. If you don't see what you're looking for in this list, then you cannot do it:
Object Name testSelect
language
scrollHeight 22
isTextEdit false
currentStyle [object]
document [object]
onmouseup null
oncontextmenu null
isMultiLine true
clientHeight 22
onrowexit null
onbeforepaste null
onactivate null
scrollLeft 0
lang
onmousemove null
onmove null
onselectstart null
parentTextEdit [object]
oncontrolselect null
canHaveHTML false
onkeypress null
oncut null
onrowenter null
onmousedown null
onpaste null
className
id
onreadystatechange null
onbeforedeactivate null
hideFocus false
dir
isContentEditable false
onkeydown null
clientWidth 26
onlosecapture null
parentElement [object]
ondrag null
ondragstart null
oncellchange null
recordNumber null
onfilterchange null
onrowsinserted null
ondatasetcomplete null
ondragenter null
onblur null
onresizeend null
onerrorupdate null
onbeforecopy null
ondblclick null
scopeName HTML
onkeyup null
onresizestart null
onmouseover null
onmouseleave null
outerText
innerText
onmoveend null
tagName SELECT
title
offsetWidth 26
onresize null
contentEditable inherit
runtimeStyle [object]
filters [object]
ondrop null
onpage null
onrowsdelete null
tagUrn
offsetLeft 29
clientTop 0
style [object]
clientLeft 0
ondatasetchanged null
canHaveChildren true
ondeactivate null
isDisabled false
onpropertychange null
ondragover null
onhelp null
ondragend null
onbeforeeditfocus null
disabled false
onfocus null
behaviorUrns [object]
accessKey
onscroll null
onbeforecut null
readyState complete
all [object]
sourceIndex 9
onclick null
scrollTop 0
oncopy null
tabIndex 0
onbeforeupdate null
outerHTML
innerHTML
ondataavailable null
offsetHeight 22
onmovestart null
onmouseout null
scrollWidth 26
offsetTop 17
onmouseenter null
onlayoutcomplete null
offsetParent [object]
onafterupdate null
ondragleave null
children [object]
onchange null
nodeValue null
firstChild null
value
length 0
dataFormatAs [Unable to display]
lastChild null
nodeName SELECT
dataFld [Unable to display]
attributes [object]
parentNode [object]
options [object]
multiple false
nodeType 1
dataSrc [Unable to display]
previousSibling [object]
form [object]
childNodes [object]
size 0
nextSibling [object]
type select-one
name testSelect
selectedIndex -1
ASKER
Thanks for the long list ;-)
Keys and mouseclicks can be governed by context, and applied there by the browser -- limited to browser window only. This would prevent keys generated by a script from doing any harm, and mouseclicks will be clipped to window area. There is no inherent security fault here.
With that said, seems that currently, there is no direct answer to my question, aside from 'not possible', or perhaps directing it to the browser people themselves.
Keys and mouseclicks can be governed by context, and applied there by the browser -- limited to browser window only. This would prevent keys generated by a script from doing any harm, and mouseclicks will be clipped to window area. There is no inherent security fault here.
With that said, seems that currently, there is no direct answer to my question, aside from 'not possible', or perhaps directing it to the browser people themselves.
This question has been abandoned. I will make a recommendation to the
moderators on its resolution in a week or two. I appreciate any comments
that would help me to make a recommendation.
<note>
In the absence of responses, I may recommend DELETE unless it is clear
to me that it has value as a PAQ. Silence = you don't care
</note>
Cd&
moderators on its resolution in a week or two. I appreciate any comments
that would help me to make a recommendation.
<note>
In the absence of responses, I may recommend DELETE unless it is clear
to me that it has value as a PAQ. Silence = you don't care
</note>
Cd&
ASKER
Hi Guys,
The value of this question is in its current conclusion:
Browsers do not provide services for generating an emulation of mouse down or key down events.
That is a valid answer. It was somewhat answered correctly by dorward.
The value of this question is in its current conclusion:
Browsers do not provide services for generating an emulation of mouse down or key down events.
That is a valid answer. It was somewhat answered correctly by dorward.
if ( objName.eventName )
{ objName.eventName(); }
So triggering the onclick for a button would work like this:
if ( buttonName.onclick )
{ buttonName.onclick(); }
The if statement doesn't need to be there if you KNOW that the object your calling has/supports that event. So if you knew that the button has/supports the onclick event, you could just do the following:
buttonName.onclick();
dorward:
No, submit() will not call the onsubmit function. As with all events, they do not cause each other to fire. Doing so could cause many events to inifinitly loop as they would cause each other to fire. So to fire off events, you must do so by hand.