javascript - jQuery 显示 id undefined 时出错

Question

我有一个以这种方式创建 div 的 jQuery 脚本

function dump_template(src,close_div)
{
    var item_template = $('<img/>', {'id':'target','src':src});
    var first_text = $('<div/>', {'id':'first_text','class':'edit_text'});
    $(first_text).css({"left":"0px",
                        "top":"0px",
                        "color":"#fff",
                        "position":"relative",
                        "width":"auto",
                        "text-align":"center"});
    $(first_text).html('Demo First Text');


    var second_text = $('<div/>', {'id':'second_text','class':'edit_text'});
    $(second_text).css({"left":"0px",
                        "top":"0px",
                        "color":"#fff",
                        "position":"relative",
                        "width":"auto",
                        "text-align":"center"});
    $(second_text).html('Demo Second Text');                    


    $('#main_canvas').html(item_template);
    var width = $("#target").width();
    var height = $("#target").height();;
    $('#main_canvas').css({'height':height+'px','width':width+'px'});


    var drag_first_text = $('<div/>', {'id':'drag_first_text','class':'context-menu-text'});
    var drag_second_text = $('<div/>', {'id':'drag_second_text','class':'context-menu-text'});
    $(drag_first_text).css({"left":"20px",
                "top":"100px",
                "position":"absolute",
                "width":"auto",
                "z-index":"5",
                "text-align":"center",
                });
    $(drag_second_text).css({"left":"20px",
                "top":"150px",
                "position":"absolute",
                "width":"auto",
                "z-index":"5",
                "text-align":"center"});
    $(drag_first_text).append(first_text);
    $(drag_second_text).append(second_text);

    $('#main_canvas').append(drag_first_text).append(drag_second_text);

    $(drag_first_text).draggable({grid:[1,1]});
    $(drag_second_text).draggable({grid:[1,1]});
    HideModalPopup(close_div);
}

现在我在 jQuery 中有一些这样的代码:

var content = $(this).find('.edit_text').text();

var outside_div_id = $(this).id;
alert(outside_div_id);

var inside_div_id = $(this).find('.edit_text').id;
alert(inside_div_id);

这里在上面的代码示例中，$(this) 指的是id为“drag_first_text”和“drag_second_text”的div对应于选中的div。

但是 alert(outside_div_id); 和 alert(inside_div_id); 都给我 undefined。

我怎样才能找到故障？

Answer 1

您需要使用 get 或使用索引将其转换为 native Element 或使用 attr("id")

var outside_div_id = $(this)[0].id; // or $(this).attr("id")
alert(outside_div_id);