if/else утверждение не вызывает функцию?

Question

Я схожу с ума. Я искал и искал несколько разных способов, я не получаю никаких ошибок, но я не могу заставить оператор if/else вызывать функцию, которую он должен вызывать. сама функция работает нормально, если вызвано иначе, просто не внутри оператора if, что происходит?

oops, ok Я удалил «var» во второй части, но он все еще ведет себя немного странно - что я хочу, чтобы это произошло, когда нажата кнопка подтверждения удаления, чтобы удалить элемент и закрыть покадрово. то, что он делает вместо этого, закрывает модальный, я должен щелкнуть delete второй раз, а затем он удалит элемент, и модально быстро всплывает.

Редактировать: Я изменил свой код, чтобы удалить прослушиватели событий, и вместо этого используйте onclick в html, чтобы узнать, не является ли эта проблема, но ее нет. im все еще имеет ту же проблему.

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 дважды удалить второй вар, и он будет работать нормально. также: его лучше, если вы остановить слушатель событий, когда вы сделали с ним и стрелять только тогда, когда вам это нужно, чтобы избежать несколько вызовов

Edit:

Помните, если пользователь нажмет кнопку отмены, а затем попробуйте нажать кнопка удаления ничего не сделает, потому что eventlister все еще помнит старый параметр (который отменяется), поэтому вам нужно найти способ отключить и отключить этого слушателя, чтобы избежать множественных вызовов. вот почему, когда вы пытаетесь удалить после нажатия его отмены не работает для вас ...

это пример:

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(); 
      } 
     }); 
    }