jQWidgets jqxDragDrop initFeedback 属性

简介

jQWidgets是一款专业的基于JavaScript的UI组件库，其中jqxDragDrop是其中的一个组件，提供了拖拽功能。而其中的initFeedback属性则是用来定义拖拽过程中的反馈信息的，比如鼠标的样式和拖拽时产生的阴影效果等。

参数

initFeedback属性可以接受一个字符串或者函数作为参数。当接受一个字符串作为参数时，可以使用预设的几种值来定义拖拽的类型和反馈效果。

| 参数值 | 描述 | | --- | --- | | 'cursor' | 该值表示默认的鼠标样式，即当拖拽时鼠标会变成箭头。 | | 'move' | 该值表示鼠标会变成十字箭头，并且会在拖拽时产生一个拖影效果。 | | 'copy' | 该值表示鼠标会变成不允许符号，并且会在拖拽时产生一个拖影效果，表示拖拽是以复制的形式进行的。 |

当接受一个函数作为参数时，可以根据实际需求自定义拖拽反馈信息。函数的参数为一个对象，包含了拖拽源和拖拽目标等信息，如下所示：

function feedbackFunction(feedback) {
  // feedback对象包含了拖拽源和拖拽目标等信息
  // 在函数中可以根据实际需求定义自己的拖拽反馈信息
}

使用示例

使用initFeedback属性的方式如下：

$('#jqxDragDropElement').jqxDragDrop({
  initFeedback: 'move', // 使用预设的拖拽反馈样式
  dragZIndex: 99999 // 拖拽目标的z-index值
});

当我们想要定义自定义的反馈信息时，可以使用函数的方式：

$('#jqxDragDropElement').jqxDragDrop({
  initFeedback: feedbackFunction, // 调用自定义函数
  dragZIndex: 99999 // 拖拽目标的z-index值
});

function feedbackFunction(feedback) {
  if (feedback.target.hasClass('drop-target')) {
    feedback.target.addClass('hover');
  }
}

上面的代码定义了一个自定义的反馈函数，它会在拖拽过程中，如果拖拽目标被鼠标悬停时，将目标的类名设置为'hover'。 这样就可以实现自定义的拖拽反馈效果了。

注意事项

如果要使用自定义的反馈函数，请确保在函数中做了合理的样式处理，并注意不要影响到被拖拽的元素本身。同时，也需要注意合理设置dragZIndex属性，以避免拖拽元素被其它元素遮挡。