0

所以我正在制作一个简单的游戏，我想知道如何在页面加载时将图像分配给随机 div。例如，我有两行标记为这样的 div 标签 -

<div id="1_1" class="mapsquare"></div>
<div id="2_1" class="mapsquare"></div>
<div id="3_1" class="mapsquare"></div>
<div id="1_2" class="mapsquare"></div>
<div id="2_2" class="mapsquare"></div>
<div id="3_2" class="mapsquare"></div>

我希望能够在页面加载时将图像（播放器精灵）随机添加到这些 div 之一。到目前为止，这就是我所拥有的，但我不确定如何使用 div id 来完成这项工作。

<script>
function myFunction()
{
var x=document.getElementById("player")
x.innerHTML=Math.floor((Math.random()*6)+1);
}
</script>

谢谢

4

4 回答 4

3

也许是这样的：

var divs = document.querySelectorAll(".mapsquare"),
    randomIndex = Math.floor( Math.random() * divs.length );
divs[randomIndex].appendChild(document.getElementById("player"));

或者，抱歉，刚刚看到了 jQuery 标签：

var $divs = $(".mapsquare");
$("#player").appendTo( $divs.get(Math.floor(Math.random() * $divs.length)) );

基本演示：http: //jsfiddle.net/DWfc6/

当然，鉴于许多游戏涉及大量随机计算，您可能希望将随机代码放入其自己的函数中，例如MDN中的这个：

function getRandomInt(min, max) {
  return Math.floor(Math.random() * (max - min + 1) + min);
}
于 2013-08-19T11:15:44.710 回答
1

尝试这个：

$('div.mapsquare:eq(' + Math.floor(Math.random() * $('div.mapsquare').length) + ')').append(player)
于 2013-08-19T11:15:48.857 回答
1

假设#player元素是要附加到随机 div 的图像，试试这个：

var $player = $('#player');
var rnd = Math.floor(Math.random() * $('.mapsquare').length);
$('.mapsquare').eq(rnd).append($player);
于 2013-08-19T11:16:37.827 回答
0

您可以使用 math.random 来获取随机 div id 值，例如

var divName = Math.ceil(Math.random()*3) + "_" + Math.ceil(Math.random()*3);

然后根据 id 你可以添加图像

请参考示例DEMO * http://jsbin.com/OqEMoVU/1/edit *

于 2013-08-19T11:22:51.493 回答