我的页面上有一个隐藏的模态框,通过调用此create.js文件进行渲染。
除了向元素添加data-meal_id属性外,其他所有工作都很顺利。
这是jquery:
var $modal, $modal_close, $modal_container, $meal_id;
$modal = $('#modal');
$modal_close = $modal.find('.close');
$modal_container = $('#modal-container');
$meal_id = <%= @meal_id %>
$modal
.data('meal_id', $meal_id)
.prepend($modal_close)
.css('top', $(window)
.scrollTop() + 100)
.show();
$modal_container.show();
$(document).on('click', '#modal .close', function() {
$modal_container.hide();
$modal.hide();
return false;
});
以下是触发上述代码之前的元素:
<div id="modal-container"></div>
<div id="modal">
被触发后......
<div id="modal-container" style="display: block;"></div>
<div id="modal" style="top: 100px; display: block;"><a href="#" class="close">cancel</a>
完全跳过数据属性??!
答案 0 :(得分:8)
如果您要设置必须使用的元素的数据属性,.data()
方法不会修改dom attr()
$modal
.attr('data-meal_id', $meal_id)