2012-02-23 4 views
2
$(".outerdiv .innerdiv").hover(function(){ 
    var variable = $(this).index(); 
}); 
var variable = 3; 
$("span").html(variable); 

оригинальный HTML из <span> устанавливается как 3 с помощью JQuery, но при наведении курсора мыши над .innerdiv я хочу это изменить его значение индекса, изменяя переменные вне функции на значение индекса специфический .innerdiv, который зависел. http://jsfiddle.net/eEUeT/9/изменить значение переменной вне функции

<div class="outerdiv"> 
    <div class="innerdiv">1</div> 
    <div class="innerdiv">2</div> 
    <div class="innerdiv">3</div> 
    <div class="innerdiv">4</div> 
    <div class="innerdiv">5</div> 
</div>  
<span></span>​ 

Я попытался http://jsfiddle.net/eEUeT/11/ это не имеет набор Orginal значение 3, однако.


И я понимаю, изменив HTML для <span>3</span> и используя приведенную ниже JQuery будет работать, но я предпочел бы узнать, как сделать это так, как я просил

$(".outerdiv .innerdiv").hover(function(){ 
    var variable = $(this).index(); 
$("span").html(variable); 
}); 
+0

@DidierGhys Я не глуп ... Вот почему я спросил, как это делается. я никогда не говорил, что это не сработает ... правильно поняли факты. и вы не заслуживаете 3 замечательных голосов. –

+1

Я не имел в виду это, и я, судя по всему, не проголосовал за собственный комментарий. Извините, если это вас обидело, это было не мое намерение. По вашему вопросу, похоже, вы ожидали этого поведения. –

+0

:) Извините, если ... я натолкнулся на наступление. это не то, что мне нужно. это то, что я использую, чтобы узнать, как работает .index(), но это просто. поэтому я думал, что изменил бы это, научившись устанавливать переменную извне функции. я вообще спрашиваю, как это делается после неудачных попыток. –

ответ

1

Если вы хотите, чтобы манипулировать элемент, вы должны выбрать его ... вы не можете назначить значение переменной и ожидать, что элемент DOM обновится. Как указано, хотя, это достаточно легко сделать так:

//set the initial HTML for the span element(s) 
var $span = $('span').html(3); 

$(".outerdiv .innerdiv").hover(function(){ 

    //update the span element(s) HTML to the index of the hovered-over `.innerdiv` element 
    $span.html($(this).index()); 
}); 

Это ставит индекс парил над-.innerdiv элемент как HTML любых <span> элементов.

Вот демо: http://jsfiddle.net/eEUeT/14/

Смежные вопросы