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）引用带有与所选div对应的id“drag_first_text”和“drag_second_text”的div。

但是alert(outside_div_id);和alert(inside_div_id);都给了我未定义的内容。

如何找到故障？

Answer 1

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

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

Answer 2

没有.id。

这样的东西

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

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

如果您有任何疑问，请与我联系。

jQuery显示id未定义时出错

2 个答案: