Firefox扩展自定义标签拖拽：实现URL拖拽但保存为标题

Firefox的书签栏支持通过**text/x-moz-url**这个私有MIME类型同时传递URL和书签标题，这正是你需要的功能——让拖拽被识别为URL，同时保存时使用自定义标题。

具体实现代码 #

在你的dragstart事件处理器中，添加这个格式的数据传递，同时保留标准格式作为兼容：

// 假设你的自定义标签项元素是element，item包含url和title属性
element.addEventListener('dragstart', (e) => {
  // Firefox专属格式：第一行是URL，第二行是书签标题
  const mozBookmarkData = `${item.url}\n${item.title}`;
  e.dataTransfer.setData('text/x-moz-url', mozBookmarkData);
  
  // 保留标准格式，确保跨场景兼容性
  e.dataTransfer.setData('text/uri-list', item.url);
  e.dataTransfer.setData('text/plain', item.url);
  
  // 明确拖拽行为为复制，避免Firefox识别异常
  e.dataTransfer.effectAllowed = 'copy';
});

原理说明 #

• text/x-moz-url是Firefox专门用于书签拖拽的私有格式，当书签栏接收到该数据时，会自动解析第一行作为书签URL，第二行作为书签标题。
• 保留text/uri-list和text/plain是为了兼容其他可能的拖拽目标（比如地址栏、文本编辑器），确保拖拽行为在其他场景也能正常工作。

内容的提问来源于stack exchange，提问作者madprops