Javascript onclick将值插入数组

Question

我有一个图像地图，定义了几个区域。我想要做的是每次有人点击特定区域时将一个值添加到数组中，并使数组实时显示在屏幕上。

在我的头部部分，我有数组（不确定这是否正确）：

<script type="text/javascript">
    var numArray = [];
</script>

然后我在页面正文的某个地方

<p class="txt"><script type="text/javascript">document.write(numArray);</script></p>

这些<map>区域是这样的：

<area shape="circle" coords="129,325,72" alt="1" href="javascript:numArray.push('1')">
<area shape="circle" coords="319,325,72" alt="2" href="javascript:numArray.push('2')">
<area shape="circle" coords="510,325,72" alt="3" href="javascript:numArray.push('3')">

例如，如果有人点击 1，然后点击 2，然后点击 3，我希望数组在<p>.

但是，当我使用它时，它不会向数组添加任何内容（或者至少没有显示值）。

Answer 1

给你的 JS 添加一个函数：

<script type="text/javascript">
    var numArray = [];
    function addNum(num) {
        numArray.push(num);
        document.querySelector(".txt").innerHTML = numArray.join('');
    }
</script>

从<p>标签中删除脚本

<p class="txt"></p>

并更新 <map>

<area shape="circle" coords="129,325,72" alt="1" href="javascript:addNum('1')">
<area shape="circle" coords="319,325,72" alt="2" href="javascript:addNum('2')">
<area shape="circle" coords="510,325,72" alt="3" href="javascript:addNum('3')">