Question

我有这个链接，当点击时会出现一个模态对话框。

<a href="#" id="addtoteam">
    Add to Team
</a>

这是单击链接后出现的对话框，

$('#addtoteam').click(function(event){
      event.preventDefault();
      var url = '<?php echo BASEURL;?>';
      var teamID = '<?php echo $_SESSION['User']['Team']['id']?>';
      var playerID = $(this).attr('player-id');
      $( "#dialogbox" ).dialog({ 
        autoOpen: true,
        buttons: { 
                  "Use Registration Credits": function(){ 
                    // execute something here before redirecting it to another page, perhaps perform the updating of the registration_credits of each team here
                    window.location = url + '/administration/add_to_team/' + playerID +'/'+ teamID +'/?credit=1'; 
                  },
                  "Pay Extra Charge": function() { 
                  //$(this).dialog("close"); 
                    window.location = url + '/administration/add_to_team/' + playerID +'/'+ teamID +'/?proceed=1';
                  },
                  "Cancel": function() { $(this).dialog("close"); } 
                },
        width: 800
      });
    });

现在这个工作正常，但它只适用于第一个链接。你看我的链接是一个列表，每一行都有一个看起来像这样的链接，

`abc| def| ghi| Add to Teamlink`
`123| 456" 789| Add to Team link` and so on.

让我感到困扰的是，当我点击abc| def| ghi| Add to Team link链接时，会出现模态对话框，但如果我点击第一个链接以外的任何链接，则不会出现该框。我的代码似乎有什么问题？感谢。

Answer 1

由于您没有提供更多信息，我只是猜测您的问题是您为所有链接设置了相同的id（addtoteam）

id必须是唯一的，因此您应该使用类选择器

<a href="#" class="addtoteam">
    Add to Team
</a>

$('.addtoteam').click(function(event){....}

Answer 2

您需要使用班级名称而不是ID来选择所有“添加到团队”链接。

<a href="#" class="addtoteam">
    Add to Team
</a>

<a href="#" class="addtoteam">
    Add to Team
</a>

<a href="#" class="addtoteam">
    Add to Team
</a>

JS：

$('.addtoteam').click(function(event){
    //code
});

单击第一个链接后显示模态对话框

2 个答案: