Question

我在这里疯了。我搜索并搜索并尝试了许多不同的方法，我没有得到任何错误，但是我无法获得if / else语句来调用它应该调用的函数。如果另外调用函数本身工作正常，只是不在if语句中，发生了什么？

哎呀，好吧我删除了＆＃34; var＆＃34;在第二部分，但它仍然表现得有点奇怪 - 我想要它做的是，当按下确认删除按钮，删除项目并关闭模态。相反，它正在关闭模态，我必须再次单击删除，然后删除该项目，模式会快速弹出关闭本身。

编辑：我更改了我的代码以删除事件侦听器并在html中使用onclick来查看是否是问题，但事实并非如此。我仍然有同样的问题。

var clickedCancel = false;
var clickedDelete = false;
//buttons false by defaul
//if cancel button is clicked, set clickedcancel to true.

//if confirm delete button is clicked, set clicked delete to true
function cancelDeletion(){
  clickedCancel = true;
}

function confirmDeletion(){
  clickedDelete = true;
}

function deleteMovie(x){
  //open modal
$('#modalContainerDelete').modal('toggle');


  if (clickedDelete == true){
    movies.splice(x,1);
  addMovieToTable();

  $('#modalContainerDelete').modal('hide');
} else if (clickedCancel == true) {

  $('#modalContainerDelete').modal('hide');
}

};

最大的问题是，我的任务是我需要一个从数组中删除特定项目的删除按钮，但我必须将删除按钮编码成一行，并删除删除按钮所在的同一行，并且部分以这种方式编码：

function addMovieToTable(){
table.innerHTML = "";
for (i=0;i<movies.length;i++){

var row = table.insertRow(0);
var cellTitle = row.insertCell(0);
var cellDirector = row.insertCell(1);
var cellDelete = row.insertCell(2);
cellTitle.innerHTML= movies[i].title;
cellDirector.innerHTML= movies[i].director;
var deleteStuff = "<button onclick='deleteMovie(" + i + ")'>Delete</button>";
cellDelete.innerHTML = deleteStuff;
}

}

带有内部html和i变量的部分是我想要编写的代码，我应该在删除任何东西之前这样做，弹出一个模态，但这是我遇到问题的主要原因是我试图在不破坏设置的情况下编写代码。

Answer 1

使用以下代码

var clickedCancel = false;
var clickedDelete = false;
//buttons false by defaul
//if cancel button is clicked, set clickedcancel to true.
var cancelDeletion = document.getElementById("cancelDeletion");
cancelDeletion.addEventListener("click", function () {
    clickedCancel = true;
});
//if confirm delete button is clicked, set clicked delete to true
var confirmDeletion = document.getElementById("deleteConfirm");
confirmDeletion.addEventListener("click", function () {
    clickedDelete = true;
});

function deleteMovie(x) {
    //open modal
    $('#modalContainerDelete').modal('toggle');
    if (clickedDelete == true) {
        movies.splice(x, 1);
        addMovieToTable();
        $('#modalContainerDelete').modal('hide');
    } else if (clickedCancel == true) {
        $('#modalContainerDelete').modal('hide');
    }
};

...

Answer 2

你声明clickedCancel clickedDelete两次删除第二个var，它会正常工作。另外：如果在完成事件监听器时停止事件监听器并在需要时立即触发它以避免多次呼叫，那就更好了

编辑：

请记住，如果用户单击取消按钮，然后尝试单击删除按钮，它将不执行任何操作，因为eventlistener仍然记住旧选项（取消）这就是为什么你必须找到一种方法来关闭和打开该监听器以避免多个调用。这就是为什么当你按下取消后尝试删除它时，它对你不起作用......

这是一个例子：

    function delete_comment(element, event){
        event.preventDefault();
        // get the post id
        var post_id    = $(element).parents("div.IdHolderDiv").attr("id");
        // get comment id
        var comment_id = $(element).parents('div.singleCommentBox').find('div.CommentdialogboxUnderPOST').attr('id');
    // here is the confirmation button (where user press cancel or delete)
        var confirmBox  = "<div id='confirm_delete_comment' class='w3-modal'>";
            confirmBox += "<div class='alert warning' >";
            confirmBox += "<center><br><br>";
            confirmBox += "<p>Are you sure you want to delete this Comment!</p>";
            confirmBox += "<button class='w3-btn w3-ripple w3-red' > Delete</button>";
            confirmBox += "<button class='w3-btn w3-ripple w3-yellow' > Cancel</button>";
            confirmBox += "<br><br></center></div></div>";
// append the confirmation box to your Dom in an empty div
        $('#confirm_delete').append(confirmBox);
        // make that div visable
        // confirmation message.
        $('#confirm_delete_comment').css('display', 'block');

        // wait user confirmation.
// and here you fire the event listener
        $("#confirm_delete_comment").on("click", "button", function(event){
            event.preventDefault(); 
            var confirm = $(this).text().trim();
// check if user says cancel or delete and then you can turn the listener off
            if( confirm == "Delete" ){
                $.post('public/ajax/delete_comment.php', {post_id:post_id, comment_id:comment_id}, function(data){
                    $.post('public/ajax/comment_get.php', {post_id:post_id}, function(data){
                        // change the counter (comment number at the id of that specific post for full modle and index page)
                        $('#post_'+post_id+'_comments').text(data); 
                        if(indexPage.length){
                            $('#showPostFullScreen #post_'+post_id+'_comments').text(data); 
                        }else if(profilePage.length){
                            $('#showPostFullScreenProfile #post_'+post_id+'_comments').text(data); 
                        }
                        // reload comments.
                        if( $('#modal_post').css('display') == 'none' ){
                            load_comments(post_id); 
                        }else if( $('#modal_post').css('display') == 'block' ){
                            load_commentsFull(post_id);

                        }

                    });
                    // get the notifications
                    load_notifications();
                });
                // remove listner. for older than 1.7 $('#infoarea_display_editon button').unbind('click');
                $('#confirm_delete_comment').off('click button');
                $('#confirm_delete').empty();
            }else if( confirm == "Cancel" ){
                $('#confirm_delete_comment').off('click button');
                $('#confirm_delete').empty();
            }
        });
    }

if / else语句没有调用函数？

2 个答案: