Question

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

使用jquery将<span>的原始html设置为3但是当将鼠标悬停在.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/但是它的原始值不是3。

AND 我理解通过将html更改为<span>3</span>并使用下面的jquery可以工作但我宁愿学习如何按照我的方式去做

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

Answer 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元素的索引放置为任何<span>元素的HTML。

以下是演示：http://jsfiddle.net/eEUeT/14/

改变函数外的变量值

1 个答案: