HTML5 Safari 中丢失的数据属性

Question

我有一个 jQueryUI 模式，它根据 HTML5 数据属性加载其内容：

<button id="add-dates-button" name="add-dates-button" href="#" class="dialog-ajax-form" data-table="jto-dates-add" data-title="Add Job" data-id="<?=$jto_id?>">Add Date(s)</button>

通过单击按钮触发以下（部分）脚本，我得到 FF 中的变量以打印到控制台就好了。但是，在 Safari 中，它们都是 post undefined:

$(document).on('click','.dialog-ajax-form',function(e){
    e.preventDefault(); 
    var targete = $(e.target);
    var tbl = $(e.target).data('table');
    var id = $(e.target).data('id');
    var title = $(e.target).data('title');
    console.log(title);
    console.log(id);
    console.log(targete);
    console.log(tbl);

但是，如果我使用以下方法访问 Safari 中的属性，我可以获得值：

console.log( document.getElementById('add-dates-button').getAttribute( 'data-table' ) );

我在很多地方都使用 dialog-ajax-form 脚本，因此访问变量 this 并不理想。谁能解释为什么我在 Safari 中丢失了这些值？

Answer 1

您确定 $(e.target) 元素是 Safari 中的按钮吗？您的选择器 .dialog-ajax-form 并非特定于 <button id="add-dates-button"> 元素，但我认为它包含在表单中。

您需要找到具有该属性的元素，也许使用：

var $target = $(e.target);
var tbl = $target.data('table') || $target.find('[data-table]').data('table');

这将使用 $(e.target) 的属性（如果有），否则查找具有该属性的子项。

HTML5 Safari 中丢失的数据属性

HTML5 data attributes lost in Safari

html

javascript

safari

jquery