传递 ID 属性答案

【问题标题】：Passing ID Attributes传递 ID 属性
【发布时间】：2011-11-18 16:43:22
【问题描述】：

我正在使用 .each 函数获取 div，但我无法将获得的 ID 传递给我的模态框函数。这是代码：

(function() {
$('div.heriyah').each(function() { 
$(this).html('<div class="add"><div id="add_button_container"><div id="add_button" class="edit_links">+ ADD NEW CONTENT</div></div></div><div class="clear"></div><div class="placeable"></div></div>');

$('.add').click(function() {
$.fallr('show', {
          content     :  '<iframe width="620" height="600" src="<? echo $URL ?>/manage_content.php?id=<? echo $pageID; ?>&div='+$(this).attr('id')+'"></iframe>',
          width       : 620 + 5, // 100 = for width padding
          height         : 600,
          closeKey        : true,
          closeOverlay    : true,
          buttons     : {}
}); 
}); 

});

})();

如果我在模态框中请求变量，我会得到 Undefined。

我用这个：

'+$(this).attr('id')+'

在我的模态框函数中获取 id。

谢谢，鼓手

【问题讨论】：

标签： jquery scope

【解决方案1】：

我不确定fallr 是什么，但请尝试将您的代码更改为：

    (function() {
    $('div.heriyah').each(function() { 
    $(this).html('<div class="add"><div id="add_button_container"><div id="add_button" class="edit_links">+ ADD NEW CONTENT</div></div></div><div class="clear"></div><div class="placeable"></div></div>'); 

    var curID = $(this).attr('id');//get the id before you go into fallr

    $('.add').click(function() {
    $.fallr('show', {
              content     :  '<iframe width="620" height="600" src="<? echo $URL ?>/manage_content.php?id=<? echo $pageID; ?>&div='+curID +'"></iframe>',
              width       : 620 + 5, // 100 = for width padding
              height         : 600,
              closeKey        : true,
              closeOverlay    : true,
              buttons     : {}
    }); 
    }); 

    }); 
})();

【讨论】：

谢谢，这很有意义。我今天学到了新东西！

【解决方案2】：

您从 SECOND 匿名函数中引用 $(this)。因此，您要的是 .add 的 $(this) 而不是 div.heriyah 这就是您没有获得 ID 的原因。

【讨论】：

【解决方案3】：

这是因为`this现在指的是fallr

$('.add').click(function() {
    var _this = $(this);
    $.fallr('show', {
              content     :  '/manage_content.php?id=&div='+_this+'">',
              width       : 620 + 5, // 100 = for width padding
              height         : 600,
              closeKey        : true,
              closeOverlay    : true,
              buttons     : {}
    }); 
});

【讨论】：

【解决方案4】：

在您构建iframe 的代码中，$(this) 将是$('.add') 的值，不是您原来的div 标记。

在绑定点击事件之前，只需创建一个新变量并存储$(this).attr('id')，然后使用该值代替。

【讨论】：

【解决方案5】：

经典范围问题 - 您正在尝试获取“.add”元素的 id 属性，因为您处于该范围内。

在 .each 函数中缓存 $(this) 并使用它：

$('div.heriyah').each(function() {
$(this).html('<div class="add"><div id="add_button_container"><div id="add_button"      class="edit_links">+ ADD NEW CONTENT</div></div></div><div class="clear"></div><div class="placeable"></div></div>');

var that = $(this);

$('.add').click(function() {
    $.fallr('show', {
          content     :  '<iframe width="620" height="600" src="<? echo $URL ?>/manage_content.php?id=<? echo $pageID; ?>&div='+that.attr('id')+'"></iframe>',
          width       : 620 + 5, // 100 = for width padding
          height         : 600,
          closeKey        : true,
          closeOverlay    : true,
          buttons     : {}
}); 
    }); 

});

【讨论】：