0

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

在我的头部分我有数组(不确定这是否正确):

<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>.

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

4

2 回答 2

5

向您的 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')">
于 2013-10-31T16:54:02.463 回答
1

document.write仅在页面加载时执行。要写入元素,最好使用document.getElementById(需要向您的 id 添加一个 id <p>),并且还可以用href=onclick 事件替换 。

这看起来像这样:

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

<area shape="circle" coords="129,325,72" alt="1" href="#" onclick="addToArray(1);">
<area shape="circle" coords="319,325,72" alt="2" href="#" onclick="addToArray(2);">
<area shape="circle" coords="510,325,72" alt="3" href="#" onclick="addToArray(3);">
<script type="text/javascript">
    var numArray = [];
    function addToArray(num){
      numArray.push(num);
      document.getElementById("pTxt").innerHTML = numArray;
      return false;
    }
 </script>
于 2013-10-31T16:58:51.727 回答