HTML5数据集与IE不兼容(9)

Ste*_*eve 1 php ajax jquery html5 dataset

我有一个调用php脚本的ajax调用,可以显示一些缩略图,以及有关缩略图的一些信息,例如完整图像的大小.此数据将放入HTML表中.$ bigwidth和$ bigheight是图像的完整大小,并img使用HTML5数据集属性编码到缩略图标记中:

 echo ("<td class='galleryThumbContainer'>
            <div class='imgWrapper'>
                <img class='galleryThumb' src=$file_url data-bigwidth='$bigwidth' data-bigheight='$bigheight' help_token='gallery thumb' title='Double-click to crop. Delete at upper right corner.'>
            </div>
          </td>");
Run Code Online (Sandbox Code Playgroud)

在客户端,当我将缩略图放入jQuery UI可放置容器时,我的脚本会拉出并使用bigwidth值,使用下面的第1行和第2行或第5行和第6行.

1.    var thumb$ = ui.draggable;        // wrapped set of thumb being dropped
2.    var bigwidth = thumb$.data('bigwidth');     // works
3.          
4.       /*  Test Code  */
5.    var thumb = ui.draggable[0];              // the raw thumb node
6.    var bigwidth2 = thumb.dataset.bigwidth;      // breaks: thumb.dataset is undefined
7.       /* end test code  */
Run Code Online (Sandbox Code Playgroud)

这两种方法都适用于Chrome和Firefox,但只有第一种方法适用于IE(9).使用IE9,第二种方法看作thumb.dataset未定义.

有谁知道发生了什么?

谢谢.

小智 5

IE9不支持数据集属性,只有最新版本(IE11)支持此功能.正如Mozilla开发者网络上所述.

另一种获取适用于所有主流浏览器的属性值的方法是:

thumb.getAttribute('data-bigwidth')
Run Code Online (Sandbox Code Playgroud)