如何在不创建新函数的情况下更改此函数中变量的值

How to change the value of the variable in this function without making a new function

本文关键字：函数 情况下 变量 创建 新函数      更新时间：2023-09-26
function SlideShow(area) {
    var SlideImg = new Array('img1', 'img2');
    var SlideArea = document.getElementById(area);
    for (i = 0; i < SlideImg.length; i++) {
        if (SlideImg[i] == SlideImg[0]) {
            var classname = 'active';
        } else {
            var classname = 'not-active';
        }
        var html = '<img src="images/room/' + SlideImg[i] + '.jpg" id="' + SlideImg[i] + '" class="' + classname + '" />';
        SlideArea.innerHTML += html;
    }
    var a = 1;
    function RunSlide() {
        var before = a - 1;
        if (a > SlideImg.length - 1) {
            a = 0;
        }
        ImgBefore = document.getElementById(SlideImg[before]);
        ImgBefore.className = 'not-active';
        ImgNext = document.getElementById(SlideImg[a]);
        ImgNext.className = 'active';
        a++;
    }
    var run = setInterval(RunSlide, 5000);
}

如何更改a值？由于 a 变量不在全局范围内，因此是否可以从另一个函数访问它？我想访问它，但不想将 a 变量声明为全局变量。

是的，变量是函数的局部变量，因此您必须在外部公开函数才能访问它。

例如，您可以将它放在函数的最后一个，使其返回一个可以设置变量的函数：

function SlideShow(area) {
  ...
  return function(value){ a = value; };
}

用法：

var setA = SlideShow(something);

然后稍后您可以使用该功能：

setA(42);

很简单，在SlideShow之外声明var a;，然后它可以全局访问。

请记住，它仍然需要使用a = 1;在功能内重置

如果你能使变量的作用域成为全局变量，那么你应该可以。 与其在函数中声明，不如引用变量并在页面的">

"中声明。 请参阅我的示例，我测试了这个，单击差异链接会更改变量的值并显示在页面上。 
<html>
<head><title>Test</title>
<script language="javascript">
var a = -1;
function changeVar(value) {
  a = value;
  document.getElementById("test1").innerHTML = a;
}
</script>
</head>
<body>
<h1>Test page</h1>
<a href="#" onclick="changeVar(2);">Click me (2)</a> <br />
<a href="#" onclick="changeVar(5);">Click me (5)</a> <br />
<a href="#" onclick="changeVar(9);">Click me (9)</a> <br />
<hr>
<h1>Value for a is: <div id="test1"></div></h1>
<!-- really test by including function later on page -->
<script language="javascript">
function SlideShow(area) {
    var SlideImg = new Array('img1', 'img2');
    var SlideArea = document.getElementById(area);
    for (i = 0; i < SlideImg.length; i++) {
        if (SlideImg[i] == SlideImg[0]) {
            var classname = 'active';
        } else {
            var classname = 'not-active';
        }
        var html = '<img src="images/room/' + SlideImg[i] + '.jpg" id="' + SlideImg[i] + '" class="' + classname + '" />';
        SlideArea.innerHTML += html;
    }
    a = 1;  // removed declaration of a and just using a from prior declaration
    function RunSlide() {
        var before = a - 1;
        if (a > SlideImg.length - 1) {
            a = 0;
        }
        ImgBefore = document.getElementById(SlideImg[before]);
        ImgBefore.className = 'not-active';
        ImgNext = document.getElementById(SlideImg[a]);
        ImgNext.className = 'active';
        a++;
    }
    var run = setInterval(RunSlide, 5000);
}
</script>
</html>

如果在函数中声明，则无法访问变量本身，因为它的作用域是 LOCAL。请参阅：http://www.w3schools.com/js/js_variables.asp

但是，有一种方法可以调整函数以设置页面上另一个元素的值，然后其他人可以引用该值。 对脚本使用相同的代码片段，当 更新时，您可以在页面上设置隐藏字段的值，然后其他人可以引用该值。 我认为您必须在函数外部声明它的任何其他方式。

备选方案 1： 

<!-- really test by including function later on page -->
<script language="javascript">
function SlideShow(area) {
    var SlideImg = new Array('img1', 'img2');
    var SlideArea = document.getElementById(area);
    for (i = 0; i < SlideImg.length; i++) {
        if (SlideImg[i] == SlideImg[0]) {
            var classname = 'active';
        } else {
            var classname = 'not-active';
        }
        var html = '<img src="images/room/' + SlideImg[i] + '.jpg" id="' + SlideImg[i] + '" class="' + classname + '" />';
        SlideArea.innerHTML += html;
    }
    var a = 1;
    function RunSlide() {
        var before = a - 1;
        if (a > SlideImg.length - 1) {
            a = 0;
        }
        ImgBefore = document.getElementById(SlideImg[before]);
        ImgBefore.className = 'not-active';
        ImgNext = document.getElementById(SlideImg[a]);
        ImgNext.className = 'active';
        a++;
        // set value of element on page so others can reference
        document.getElementById("test1").innerHTML = a;  // or set a hidden field
    }
    var run = setInterval(RunSlide, 5000);
}
</script>

另一种可能做到的方法是用 a 的值声明函数的返回，调用者可以根据需要忽略它，其他人可以检索它。 这可能不适用于重新调用 RunSlide 函数的 setTimeOut。 我在幻灯片中尝试了另一个内部函数，但似乎也没有返回。 原始的范围界定建议仍然存在。

相关文章：