javascript - 单击单个按钮即可打开 2 个弹出窗口

Question

//html

    <div class="modal-footer">
    <button type="button" class="btn btn-primary" id="adduserteam" data-toggle="popover" data-placement="top" data-content="select atleast one employee!" data-trigger="focus">Add</button>

    <button type="button" class="btn btn-primary" id="removeuserteam" data-toggle="popover" data-placement="left" data-content="select atleast one employee!" data-trigger="focus">Remove</button>
    </div>

// on click function//

$('#removeuserteam').on('click',function() {
    if(teamuser.rows('.selected').data().length > 0){   
        $.ajax({
                    url : "../../rest/teamRest/removeFromTeam",
                    type : "POST",
                    dataType : "json",
                    contentType : "application/json",
                    data:       JSON.stringify(test.emp),
                    success : function(data) {
                            teamuser.ajax.reload();
                            alert("success deleteRule: ");
                            $('#addteammodal').modal('hide');
                            },
                            error : function(request,status,error) {
                                    teamuser.ajax.reload();
                                    alert("error deleteRule: ");
                                }
                                });
                                $('.edit').removeClass('edit');
                        }
                        else
                            $('[data-toggle="popover"]').popover('show');

                });

在这段代码中，我有 onclick 函数，按钮的 html 部分，如果我单击“removeuser”按钮，即使弹出窗口正在打开，我也会有一个具有相同配置的按钮

Answer 1

原因是两个按钮都有

data-toggle="popover"

因此两个弹出窗口都会打开。

而是通过 id 或 $(this) 进行操作:

$('#adduserteam').click(function(){
   $(this).popover('show');
})
$('#removeuserteam').click(function(){
   $(this).popover('show');
})

更新问题后:

$('#removeuserteam').on('click',function() {
    var $this = $(this);
    if(teamuser.rows('.selected').data().length > 0){   
        $.ajax({
                    url : "../../rest/teamRest/removeFromTeam",
                    type : "POST",
                    dataType : "json",
                    contentType : "application/json",
                    data:       JSON.stringify(test.emp),
                    success : function(data) {
                            teamuser.ajax.reload();
                            alert("success deleteRule: ");
                            $('#addteammodal').modal('hide');
                            },
                            error : function(request,status,error) {
                                    teamuser.ajax.reload();
                                    alert("error deleteRule: ");
                                }
                                });
                                $('.edit').removeClass('edit');
                        }
                        else
                            $this.popover('show');

                });