Question

我刚开始学习JavaScript并想尝试一些东西。
如何让JavaScript函数在其他函数上运行？就像，我想当你点击一个div时，其他div会有background-color:yellow;（或JS中的x.style.backgroundColor="yellow";），如下所示：

<div onclick="yellow">Click me to paint the other div in yellow</div>
<div id="painted">I should be painted yellow if you click the above div!</div>

在C语言中，我知道如果你调用递归就可以，所以尽管我不知道，但我尝试使用它。
当然它没有成功但是如果你想看的话就有jsbin。

问：如何使用JavaScript在其他div函数中绘制黄色背景中的div？
提前致谢。

Answer 1

您必须使用fillYellow()，

等括号附加函数

<div onclick="fillYellow()">Click me to paint the other div in yellow</div>
<div id="painted">I should be painted yellow if you click the above div!</div>

<script>
function fillYellow(){
    document.getElementById('painted').style.background = "yellow";
}
</script>

在此函数内部获取painted div的id，并为此div应用背景颜色。

Answer 2

您应该document.getElementById("backgroundChange");而不是getElementById("backgroundChange");并且它会起作用：）

Answer 3

因为你的问题是“我怎样才能使JavaScript功能在其他功能上运行？”我开始认为你可能真的在谈论做事件驱动的事情。

因此，为什么不考虑这个（略微更高级）的解决方案

当您点击<div>时，您会在每<div>个时触发自定义“绘画”事件。
- 自动触发的事件与其他<div> s不同。
当<div> node看到“绘画”事件e时，它会将e.style应用于node.style

代码看起来像这样

function paintEvent(style) { // function make a custom event
    var ev = new Event('paint');
    ev.style = style;
    return ev;
}

function applyPaint(node, style) { // function to style a node
    var key;
    for (key in style) { // loop over object
        node.style[key] = style[key];
    }
}

function paintHandler(e) { // function to fire when you see a "paint" event
    applyPaint(this, e.style);
}

function clickHandler(e) { // function to fire when you see a "click" event
    var divs = document.getElementsByTagName('div'),
        i,
        paint = paintEvent({'background-color': 'yellow'});
    this.dispatchEvent(paintEvent({'background-color': 'red'}));
    for (i = 0; i < divs.length; ++i) { // loop over array-like
        if (divs[i] !== this)
            divs[i].dispatchEvent(paint);
    }
}

window.addEventListener('load', function () { // when the Window has loaded
    var divs = document.getElementsByTagName('div'),
        i;
    for (i = 0; i < divs.length; ++i) { // loop over array-like
        divs[i].addEventListener('click', clickHandler); // attach the handlers
        divs[i].addEventListener('paint', paintHandler);
    }
});

DEMO

Answer 4

您的黄色事件处理程序应该使用id“paint”查找div，然后向其中添加一个类，它将为其提供黄色文本。

这是一种方式（一种简单的方式）但是其他一些类似方法可以实现这一目标。

Javascript如何使函数在其他函数上工作

4 个答案:

DEMO