variables and jquery: how capture value and use them (part 3)
ok guys, I have had a last post about the question variables and jquery: how capture value and use them (part 3). You can find other questions about looking for variables and jquery: how capture value and use them (part 1) and variables and jquery: how capture value and use them (part 2).
I had to do: 1. capture a value from an ul-li list; 2. insert it into a global va开发者_如何学Pythonriable (not has been successful); 3. use this variable for another click function.
Now I present my solution code (with the helps of the community) that sounds, but I would like to optimize it.
I have a ul-li list of cities with an event mouseover:
<ul id="country_list" onmouseover="cl();">
<li><a id="pulsante1" href="#">Roma</a>
<li><a id="pulsante2" href="#">Milano</a>
<li><a id="pulsante3" href="#">Venezia</a
this is my CSS:
.selected
{
background-color: #FFFFFF;
}
begin the function, with comment:
function cl(){
$('.map').maphilight(); // call a plug-in to illuminate the maps
$('#country_list li a').mouseover(function(e){ //on mouseover over the list
// change background color at the element of the list over the mouse is
$( e.target ).addClass('selected');
//put id value in a variable. I'm going to capture pulsante1 for example more #
var $regionMap = '#' + e.target.id;
// put the value
var $variab = '#'+ e.target.innerHTML;
//control
//alert(regionMap);
// alert (variab);
// this part is the plugin for highlight some particular areas (the cities' areas). form here to...
$($regionMap).mouseover(function(a) {
$($variab).mouseover();
});
$($regionMap).mouseout(function(a) {
$($variab).mouseout();
});
});
//... here
//remove background color
$('#country_list li a').mouseout(function(e){
$( e.target ).removeClass('selected');
});
// mousedown function.
$('#country_list li a').mousedown( function(e) {
// e.target is the element you clicked, give me HTML value (Roma for example)
var $variabile = e.target.innerHTML;
var $alfa= '#' + $variabile; // Roma is now #Roma
// alert("You entered: " + $alfa); //control
//control dialog($alfa); // this call a dialog function giving its *$alfa* value
});
}
ok. this are my problems:
I don't like use onmouseover here
<ul id="country_list" onmouseover="cl();">but it doesn't seem work in other way ('#country_list').mouseover doesn't work Ideas?I would like divide the function cl() for the part relative at mousedown. For this I need have two global variables with the value of:
a. id li (for example pulsante1). For me this should be regionMap. b. name li (for example Roma). For me this should be variab.
but I don't know the way to obtain a global variable!
I have declared them in the <head></head> between <script> regionMap=""; variab="";
I have tryed whit $ in front, and in a lot of other ways but all my tentatives have been unfulfilled...
So you have help for me?
Thanks
For your first problem
instead of using the onmouseover attribute it is better to bind the mouseover event to the jQuery object. You can do that by using the following code:
$('ul#country_list').bind('mouseover', function () { // do what you want to do on mouse over });
You can also first define a function and then use that as the second argument for the bind function. For example:
var cl = function () { // do something };
$('ul#country_list').bind('mouseover', cl);
Then your second problem, im not sure what you mean with "the part relative at mousedown". But for global variables you can do this in different ways.
What I always like to do (note this is an example of doing it not a standard):
Create an empty object within the window variable for example:
window.globals = {};
function test () {
window.globals.test = 'this is available everywhere!';
}
test();
console.log(window.globals);
加载中,请稍侯......
精彩评论