当回显html时调用html attr

时间:2013-01-27 03:28:41

标签: php javascript jquery ajax

我通过将控制器中的html回显到ajax函数来创建列表。所以我的javascript通过ajax获取这些数据并创建li ...然后我想从这个创建的html中调用一个属性...它不起作用。 ......我做错了什么?

JAVA SCRIPT

//创建列表

$.ajax({
             url:'ol_locations',  // ol_locations is a controller, see below.
             dataType: 'html',

                success: function (data3){

            //  list elements in the ordered list


            $('ol.locations_list').html(data3);
                }});
//list populated successfully

控制器ol_location ............

public function ol_locations(){

    $this->load->model('model_location');
    $data = $this ->model_location -> fetch_location_data();
    $i=1;
    foreach ($data as $row){



        if ($row->Type == 'locality'){

            echo "<div data-color ='red' id='".$i."'><li><a href ='#'> <span class='location_title'>". $row -> Nickname . " </span> ". $row->FormattedAddress .
            "</a> <a class='remove_location' title='Remove this location' data-nid='{$row->Id}'
            style='float:right;'>x</a>" ." </li> </div>";
            $i++;
        }
        else {
                 echo "<div data-color ='red' id='".$i."'><li> <a href ='#'><span class='location_title'>". $row -> Nickname. " ". $row -> Radius ." km of </span> ". " </span> ". $row->FormattedAddress ."</a><a class='remove_location' title='Remove this location' data-nid='{$row->Id}'style='float:right;'>x</a>" ." </li> </div>";
            $i++;
        } }
}

现在HTML呈现良好......但是当我尝试访问此“创建的HTML”中的任何元素时,没有任何反应......

例如alert($('#1')。attr('color'));将给出“null”或未定义。

我尝试过很多像

这样的事情

var initial_location = $('ol.locations_list li a')。 ATTR( 'href' 属性);

仍为空......

我真的被困在这里......

1 个答案:

答案 0 :(得分:0)

由于您说html已正确添加到您的DOM中,因此您可能会尝试在实际加载之前访问新元素。确保仅在$('ol.locations_list').html(data3);之后放置与新元素相关的任何代码,例如 -

$.ajax({
         url:'ol_locations',  // ol_locations is a controller, see below.
         dataType: 'html',

            success: function (data3){

        //  list elements in the ordered list


        $('ol.locations_list').html(data3);
}}).done(function() {
    alert ($("#1").attr('data-color'));
});