Force a Javascript Event (onmouseup) programatically

Hello All,

I have a problem, I am a bear. jk :) As soon as I click down on an item in a select list, I want that item to be selected, but it will not be selected until there has been a mousedown and a mouseup. How can I get around this or force a mouseup event as soon as they mousedown on the drop list. Does this make sense? It doesn't neceaarily have to be 'selected', if for example there is a way to find out what item has been mousedown'ed on, that would be sufficient, but I have no idea except for a really bad way that looks at x and y co-ordinates of the mouse and finds which item you would have been over.



"The Earth is but One Country, and Mankind its Citizens" - Baha'i Faith
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

I'm a bit confused.

Try this:

<select onChange="document.getElementById('txt').innerHTML = this.value">
<option value="Option 1">Option 1
<option value="Option 2">Option 2
<option value="Option 3">Option 3
<span id="txt">Option 1</span>

Tell me what else it needs to do.
i can't think of any other way besides capturing the Y cords of the mouse
this is super simplified and probably has a million problems and I would never use it on any site i design

but maybe you would

<script language="Javascript">
// Detect if the browser is IE or not.
// If it is not IE, we assume that the browser is NS.
var IE = document.all?true:false

// If NS -- that is, !IE -- then set up for mouse capture
if (!IE) document.captureEvents(Event.MOUSEMOVE)

// Set-up to use getMouseXY function onMouseMove
document.onmousemove = getMouseXY;

// Temporary variables to hold mouse x-y pos.s
var tempX = 0
var tempY = 0

// Main function to retrieve mouse x-y pos.s

function getMouseXY(e) {
  if (IE) { // grab the x-y pos.s if browser is IE
    tempX = event.clientX + document.body.scrollLeft
    tempY = event.clientY + document.body.scrollTop
  } else {  // grab the x-y pos.s if browser is NS
    tempX = e.pageX
    tempY = e.pageY
  // catch possible negative values in NS4
  if (tempX < 0){tempX = 0}
  if (tempY < 0){tempY = 0}  
 window.status = 'temp y = ' + tempY
  return tempY

function whichIsClicked(){
var min = 20
var select = document.forms[0].elements[0];
   if(tempY >= min && tempY < min + 17)
        alert('You have moused down on ' + select.options[i].text);
    min += 17

<select size=10 onmousedown="whichIsClicked();">

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Determine the Perfect Price for Your IT Services

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden with our free interactive tool and use it to determine the right price for your IT services. Download your free eBook now!

YogiMySonMySonAuthor Commented:
Thanks a lot for the ideas.

hmm, is there a way of forcing a mouseup event without the mouse actually being un-pressed?
I would rather not use the x-y co-ordinates. You know what i'm trying to do right? get the value of the item in the list box right after my mouse is clicked down on it (before I actually let go of the mouse, which would be an 'onClick'). I haven;t tried yours Timbo but i'm assuming onChange is the same(needs a full click, mouse-up and mouse-down.). Is there a way to do it with the drag events? Basically the whole reason I am asking this question is because, say for example there is this list:


And I click on 'Apples' and 'drag' it to another part of the screen(actually just make a <div>who's innerText is set to the item I chose in the List and I make it follow my mouse. )

Now, I want to drag 'Oranges', so I put my mouse on Oranges and drag it, BUT Apples is still highlighted and I end up dragging a piece of text that says the wrong thing "Apples".

I don't want to have to click completely on the item(mouse-up, and mouse-down), THEN drag it across, which I know works because now the thing I actually want to drag is selected. I just want to be able to click on it once and drag.
YogiMySonMySonAuthor Commented:
Bustarooms, you don't need to use the X - co-ordinate do you? Are all standard list box items 17 pixels high? If I track the Y position of the list box that code should work all the time (I think). For what reason wouldn't you use it?
they are not necessarily 17 pixels high.   there are way too many variables involved here such as browser type, client settings, OS...i just wouldnt do it

no need for X, but that is a function i use for getting both X and Y but we only use the Y here.

you can track where the list box's top part is by changing the min value   var min = 600;
dont give me a b just because you dont like the answer
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today

From novice to tech pro — start learning today.