0

我的网页上发生了一些奇怪的事情。

我想在单击按钮时添加一个确认 jquery 对话框。问题是....我的页面上有多次该按钮,每个都有其“id”并且由 php 创建(因此页面上可以有 2、3、4、5 个按钮)。

该按钮如下所示:

            <a href="#" id="confirm" onclick="addlist(<?php echo $v['id'];?>);return false;"><img src="img/item_add.png" alt="add" width="100" height="46" /></a>

这是我的jQuery

  $(document).ready( function(){

$('#dialog').dialog({
    autoOpen: false,
    width: 600,
    buttons: {
        "Ok": function() {
            $(this).dialog("close");
        },
    }
});

$('#confirm').click(function() {
    $('#dialog').dialog('open');
    return false;
    });
});​

问题是,我的 jquery 代码工作得很好,但只适用于第一个按钮,第二个,第三个......等等

你有我的例子:http: //jsfiddle.net/S4vSU/1/

我希望该对话框适用于每个按钮。哪里有问题 ?

先感谢您 !

4

5 回答 5

5

特定元素的“ id”在整个页面上必须是唯一的......
如果不是,那么只有一个(第一个)元素将被处理......

解决方案:为所有按钮提供一些类,而不是通过类名来处理 id

例如:

<a class="temp" href="#" id="confirm" onclick="addlist(<?php echo $v['id'];?>);return false;">
    <img src="img/item_add.png" alt="add" width="100" height="46" />
</a>

其他代码将是

$(document).ready( function(){

$('#dialog').dialog({
    autoOpen: false,
    width: 600,
    buttons: {
        "Ok": function() {
            $(this).dialog("close");
        },
    }
});

$('.temp').click(function() {
    $('#dialog').dialog('open');
    return false;
    });
});​
于 2012-05-21T11:25:02.357 回答
1

这是因为您的所有按钮都具有相同的 id。html 中元素的 ID 应该是唯一的。

你可以让所有人都和我一样上课

于 2012-05-21T11:22:02.297 回答
1

使用类或使用不同的 id,例如:

$('#confirm1, #confirm2').click(function() {
    $('#dialog').dialog('open');
    return false;
    });
});

或使用类: jsFiddle

于 2012-05-21T11:23:32.963 回答
1

id每个项目应该是唯一的..但你可以尝试使用on()虽然不推荐使用:

http://jsfiddle.net/S4vSU/7/

$(document).on('click','#confirm', function() {
    $('#dialog').dialog('open');
    return false;
    });
});​
于 2012-05-21T11:24:37.660 回答
1

您也可以在元素和点击功能中使用类而不是 ID。

<a class="confirm" href="javascript:;">Confirm 1</a>
<a class="confirm" href="javascript:;">Confirm 2</a>
...
$('.confirm').click(function() {
    $('#dialog').dialog('open');
    return false;
    });
});​
于 2012-05-21T11:27:56.747 回答