Question

我正在使用一个我想编辑并发展成游戏的开源项目。

它使用javascript拖放操作，使用数字创建一堆混洗卡，然后使用math.random随机显示。

我正在寻找为每个号码使用不同的图像。

是否有

numbers[1] = image url;
numbers[2] = image url;

或是否使用图像而不是

中的数字

var numbers =['<img src="../card-one.png">', '<img src="../card-two.png">']

目前，如果我只是添加上面的图像，则无法识别拖放功能。

var numbers = [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ];
  numbers.sort( function() { return Math.random() - .5 } );

  for ( var i=0; i<10; i++ ) {
    $('<div>' + numbers[i] + '</div>').data( 'number', numbers[i] ).attr( 'id', 'card'+numbers[i] ).appendTo( '#cardPile' ).draggable( {
      containment: '#content',
      stack: '#cardPile div',
      cursor: 'move',
      revert: true
    } );
  }

  // Create the card slots
  var words = [ 'one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine', 'ten' ];
  for ( var i=1; i<=10; i++ ) {
    $('<div>' + words[i-1] + '</div>').data( 'number', i ).appendTo( '#cardSlots' ).droppable( {
      accept: '#cardPile div',
      hoverClass: 'hovered',
      drop: handleCardDrop
    } );
  }

}

查看这个小提琴，了解当前脚本的功能

http://jsfiddle.net/Vp89Z/

Answer 1

怎么样：

var imag = new Image();
imag.src = 'src-to-image';
number[1] = imag;

javascript将图像拖放为数字变量

1 个答案: