Question

我在javascript中制作拖放工具。我有一组图像可以拖放到网格中。该网格有3行20列。

当图像被拖动到网格上时，我想保存这些数据。例如，我拖动图像并将其放在第1行第2列。如何在javascript中保存这些数据？

在php中，这将是：

<modal  title="{{modalRolesTableTitle}}" visible="{{showModalRightsTable}}"> SOME CONTENT</modal>

通过这种方式，我可以检查该位置是否已有图像。或者，如果我想更改现场的选项，我可以在$ savedItems数组中搜索。

但是如何在javascript中保存这些数据呢？因此，在阵列中添加和搜索数据很容易。

Answer 1

每当执行拖放操作时，您必须知道要删除的行和列的索引。执行拖放操作时，调用saveValues（rowIndex，columnIndex，value）等函数将该位置的值保存到数组中。在保存之前，请检查该位置是否已包含除默认值以外的某些数据。如果是，则不保存值并中断，以便不执行拖放，否则保存值，然后执行拖放。

让我们假设您的数组命名为：dragDropGrid

    function saveValues(rowIndex, columnIndex , value) {

    // value here is something related to that image .

    var valueAtIndex = dragDropGrid[rowIndex][columnIndex] ;

      if(valueAtIndex != null || valueAtIndex != "" || valueAtIndex != undefined ) {

         // If there already exists a value

         return false; // something to break the drag drop


     }else{ // if array location is empty

       dragDropGrid[rowIndex][columnIndex] = value;  //saved value at that index.

     return true; // now call drag drop.
    }

  }

执行dragDrop后，您可以在某些事件上直接调用此函数。确保函数正确返回，以便继续或中断拖放。

由于

Answer 2

在JavaScript中几乎完全相同。

var cells = [ [ ], [ ], [ ] ];

function insertImage(row, column, image) {
  if (cells[row][column]) {
    console.info('Already exists!');
    return false;
  } else {
    cells[row][column] = image;
    return true;
  }
}

Answer 3

您可以将$ savedItems打印为javascript全局变量。

<?php
echo '<script>';
echo 'var saved_items = ' . json_encode($savedItems); . ';';
echo '</script>';

Javascript将数据保存在对象或数组中

3 个答案: