Question

我有一个如下所示的数组（通过ajax）：

data[i].id: gives the id of user i
data[i].name: gives the name of user i

我想输出这样的数组：

X Leonardo Da Vinci
X Albert Einstein
X William Shakespeare
...

X是必须可点击的图像（x.gif）。单击时，必须转到functiontwo（），传递参数data [i] .id。 Functiontwo将打开一个带有“删除id data [i] .id”的问题的jquery对话框？

我知道这不会太难，但我似乎无法弄明白...... 这就是我到目前为止所做的：

function functionone() {


    $.ajax({
        type : 'POST',
        url : 'post.php',
        dataType : 'json',
        success : function(data){

            var message = "";
            var i = 0;


            while (i < (data.length - 1))
                            {
                 var myvar = data[i].id;
                 message = message + "<div class=" + data[i].id + "><img src=x.gif></div>" + data[i].name + "<br />";


                 $('#somediv').html(message).fadeIn('fast');
                  $("." + data[i].id + "").click(function () {
                  functiontwo(myvar);
                });
                i++;

            }



        }


    });

}

 function functiontwo(id) {
 ...}

我知道为什么这不起作用。 Var我会在while循环中一次又一次地填充。当while循环停止时，我只是一个数字（在这种情况下是数组长度），并且jquery变为（例如）：

$("." + data[4].id + "").click(function () {
                  functiontwo(myvar);
                });

，只使最后一个X可点击。

我该如何解决这个问题？非常感谢!!!

编辑：

这是我的第二个功能：

 function functiontwo(id) {

  $("#dialogdelete").dialog("open");

     $('#submitbutton').click(function () {

        $('#submitbutton').hide();
        $('.loading').show();
                    $.ajax({
        type : 'POST',
        url : 'delete.php',
        dataType : 'json',
        data: {
            id : id
        },
        success : function(data){

            var mess = data;
            $('.loading').hide();
            $('#message').html(mess).fadeIn('fast');


        }
    });

    //cancel the submit button default behaviours
    return false;



        });


    }

在delete.php中没有什么特别的，我使用$ _POST ['id']。

Answer 1

正如我在评论中指出的那样。问题是.click部分。使用bind，或者对所有元素使用类，以及像这样的点击事件$('.classnamehere').live('click',function () { // stuff });

Answer 2

function functionone() {

    $.ajax({
        type : 'POST',
        url : 'post.php',
        dataType : 'json',
        success : function(data){

            var message = "";
            var i = 0;

            while (i < (data.length - 1))
                            {
                 var myvar = data[i].id;
                 message = message + "<div class=\"clickable\" id=" + data[i].id + "><img src=x.gif></div>" + data[i].name + "<br />";

                 $('#somediv').html(message).fadeIn('fast');
                i++;
            }
        }
    });
}

$('.clickable').live('click',function () {
    alert($(this).attr('id') + ' this is your ID');
});

Answer 3

通常的技巧是创建一个单独的函数来创建事件处理程序。单独的函数将接收i作为参数，生成的事件将能够为自己保留此变量

make_event_handler(name){
    return function(){
        functiontwo(name);
    };
}

...

$("." + data[i].id + "").click( make_event_handler(myvar) );

数组和while循环：使唯一可点击

3 个答案: