Ajax 仅被第一个按钮调用

Question

<?php $count = 1; foreach ($settings[$slug] as $slug): ?>
    <div data-toggle="buttons-radio" class="btn-group">
       <button id="enable" value="1" class="btn btn-success active" type="button"           name="includeicon"><i class="icon-ok icon-white"></i></button>
       <button id="disable" value="0" class="btn" type="button" name="includeicon"><i class="icon-remove"></i></button>
    </div>
<?phpendforeach?>

$(document).ready(function(){

    $("#enable").click(function(event) {
    var slugid = $('#slugid').val();
    $.ajax({
           url: SITE_URL + 'admin/PluginConf/enable/?'+slugid,
        type: "POST",
        data : {'slugid' : slugid},
        success: function(data) {
                    }
                 });
    }); 

    $("#disable").click(function(event) {
    var slugid = $('#slugid').val();
    $.ajax({
        url: SITE_URL + 'admin/PluginConf/disable/?'+slugid,
        type: "POST",
        data : {'slugid' : slugid},
        success: function(data) {
                    }
     });
    });
        }); 

我在 jquery 中传递按钮 id，但只为第一个按钮调用 ajax。对于第二个和其他人，它没有被调用，任何人都可以帮助我吗？ 谢谢

Answer 1

foreach 中的 ID 为 enable 和 disable。如果循环多次执行，那么您将拥有多个具有相同 ID 的按钮。 ID 必须是唯一的！而是使用其他东西来识别点击：

我建议将enable 类添加到启用按钮，将disable 类添加到禁用按钮，然后像这样捕获事件：

$('.enable').click(function() {
    // code in here
});

$('.disable').click(function() {
    // code in here
});

Answer 2

不要通过 id 绑定多个项目的点击事件！ ID 必须是唯一标识符。

<?php $count = 1; foreach ($settings[$slug] as $slug): ?>
    <div data-toggle="buttons-radio" class="btn-group">
       <button value="1" class="enable btn btn-success active" type="button"           name="includeicon"><i class="icon-ok icon-white"></i></button>
       <button value="0" class="btn disable" type="button" name="includeicon"><i class="icon-remove"></i></button>
    </div>
<?phpendforeach?>

$(document).ready(function(){

    $(".enable").click(function(event) {
    var slugid = $('#slugid').val();
    $.ajax({
           url: SITE_URL + 'admin/xervPluginConf/enable/?'+slugid,
        type: "POST",
        data : {'slugid' : slugid},
        success: function(data) {
                    }
                 });
    }); 

    $(".disable").click(function(event) {
    var slugid = $('#slugid').val();
    $.ajax({
        url: SITE_URL + 'admin/xervPluginConf/disable/?'+slugid,
        type: "POST",
        data : {'slugid' : slugid},
        success: function(data) {
                    }
     });
    });
}); 

Answer 3

当您的案例按钮中的多个元素具有相同的 id 时，您使用的 id 是不正确的。当您使用 foreach 循环时，您会创建多个具有相同特定 id 的按钮。 ID 表示某事物是唯一的，并且只有一个元素可以具有该特定 ID。我假设您应该为此按钮创建一个类，并考虑到这一点来更改您的脚本代码。这是我的建议。希望能帮助到你。

<?php $count = 1; foreach ($settings[$slug] as $slug): ?>
<div data-toggle="buttons-radio" class="btn-group">
   <button value="1" class="btn btn-success active enable" type="button"             name="includeicon"><i class="icon-ok icon-white"></i></button>
   <button value="0" class="btn disable" type="button" name="includeicon"><i class="icon-remove"></i></button>
</div>
<?php endforeach; ?>

$(document).ready(function(){

$(".enable").click(function(event) {
var slugid = $('#slugid').val();
$.ajax({
       url: SITE_URL + 'admin/xervPluginConf/enable/?'+slugid,
    type: "POST",
    data : {'slugid' : slugid},
    success: function(data) {
                }
             });
}); 

$(".disable").click(function(event) {
var slugid = $('#slugid').val();
$.ajax({
    url: SITE_URL + 'admin/xervPluginConf/disable/?'+slugid,
    type: "POST",
    data : {'slugid' : slugid},
    success: function(data) {
                }
 });
});
    });