更改函数外部的变量值

change variable value outside function

本文关键字：变量值 外部 函数      更新时间：2023-09-26
$(".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。

而且我理解通过将 html 更改为 <span>3</span> 并使用下面的 jquery 将起作用，但我宁愿学习如何按照我要求的方式进行操作

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

如果你想操作一个元素，你必须选择它...您不能为变量赋值并期望 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/

相关文章：