javascript - 处理时的 jQuery 数据表和动画 SVG

Question

我对 jQuery 数据表还很陌生。事实上，我在初级水平上使用它还不到一周。

在我为客户开发的应用程序中，dataTable 选项之一是带有用于处理选项的 img 标记的语言。像这样:

"oLanguage": {
            "sProcessing": "<img src='<?php echo BASE_PATH; ?>/asset/img/ajax-loader_dark.gif'>",
            "sSearch":       "S&oslash;g:",
            "sLengthMenu":   "Vis _MENU_ linjer",
            "oPaginate": {
                "sFirst":    "F&oslash;rste",
                "sPrevious": "Forrige",
                "sNext":     "N&aelig;ste",
                "sLast":     "Sidste"
            }
},

作为应用程序用户体验优化的一部分，我想用更现代的方法更改旧的 gif 加载器。我开始研究 SMIL(动画 SVG)以及旧版浏览器的后备方案，然后我进入了解决方案的丛林!

我遇到了一个指南:https://css-tricks.com/a-complete-guide-to-svg-fallbacks/但我不确定这是否适用于 SMIL？

所以我的问题是:
- 实现动画 SVG 并为旧版浏览器提供回退的最佳方法是什么？
- 如何使其在数据表的“sProcessing”选项中工作？

注意，该应用程序是由另一位开发人员制作的，因此我没有制作此解决方案。我只是在优化用户体验。

Answer 1

我不太了解 SVG 回退或所需的功能检测，但您需要使用 JavaScript 变量或函数来为 sProcessing 返回适当的值

类似于:

var processing_img;
if(svgFeatureDetecion){
   processing_img = 'your-svg-source';
} else {
  processing_img = "<img src='<?php echo BASE_PATH; ?>/asset/img/ajax-loader_dark.gif'>";
}

var tableOpts={
   "oLanguage": {
      "sProcessing": processing_img,
      // ...
   }
};

$('#my-table').DataTable(tableOpts);