Force a Javascript Event (onmouseup) programatically

Posted on 2003-12-04
Last Modified: 2011-09-20
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
Question by:YogiMySonMySon
  • 4
  • 2
LVL 15

Expert Comment

ID: 9879307
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.
LVL 10

Expert Comment

ID: 9879675
i can't think of any other way besides capturing the Y cords of the mouse
LVL 10

Accepted Solution

Bustarooms earned 30 total points
ID: 9879679
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();">
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!


Author Comment

ID: 9880311
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.

Author Comment

ID: 9880397
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?
LVL 10

Expert Comment

ID: 9881885
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;
LVL 10

Expert Comment

ID: 9889027
dont give me a b just because you dont like the answer

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
How to combine and minify CSS and JS files 5 36
send email part1 9 39
JS library vs Js framework 11 20
Glitching Slide Show 19 26
In this article, we'll look how to sort an Array in JavaScript, including the more advanced techniques of sorting a collection of records either ascending or descending on two or more fields. Basic Sorting of Arrays First, let's look at the …
Having worked on larger scale sites, we found out that you are bound to look at more scalable solutions to integrating widgets, code snippets or complete applications and mesh them into functional sites, in any given composition. To share some of…
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…

685 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