Solved

Force a Javascript Event (onmouseup) programatically

Posted on 2003-12-04
7
709 Views
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.

Regards,

Riaz

"The Earth is but One Country, and Mankind its Citizens" - Baha'i Faith
0
Comment
Question by:YogiMySonMySon
  • 4
  • 2
7 Comments
 
LVL 15

Expert Comment

by:Timbo87
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
</select>
<br>
<span id="txt">Option 1</span>

Tell me what else it needs to do.
0
 
LVL 10

Expert Comment

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

Accepted Solution

by:
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


<html>
<head>
<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];
  for(i=0;i<select.length;i++){
   if(tempY >= min && tempY < min + 17)
        alert('You have moused down on ' + select.options[i].text);
    min += 17
  }

}
</script>
</head>
<body>
<form>
<select size=10 onmousedown="whichIsClicked();">
<option>one
<option>two
<option>three
<option>four
<option>five
</select>
</form>
</body>
</html>
0
What Is Threat Intelligence?

Threat intelligence is often discussed, but rarely understood. Starting with a precise definition, along with clear business goals, is essential.

 

Author Comment

by:YogiMySonMySon
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:

-Apples
-Oranges
-Pears

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.
0
 

Author Comment

by:YogiMySonMySon
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?
0
 
LVL 10

Expert Comment

by:Bustarooms
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;
0
 
LVL 10

Expert Comment

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

Featured Post

What Should I Do With This Threat Intelligence?

Are you wondering if you actually need threat intelligence? The answer is yes. We explain the basics for creating useful threat intelligence.

Join & Write a Comment

The task A number given should be formatted for easy reading by separating digits into triads. Format must be made inline via JavaScript, i.e., frameworks / functions are not welcome. So let’s take a number like this “12345678.91¿ and format i…
This article discusses how to create an extensible mechanism for linked drop downs.
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…

707 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