Javascript顯示隱藏輸入在第二次加載引導模態時不起作用

Question

我有一個JavaScript代碼可以使用引導模態內的復選框來隱藏和顯示上傳輸入，第一次啟動模態時它可以工作，但是第二次我打開模態，然后單擊復選框以顯示上載輸入，它會顯示，但隨后會自動隱藏。

$('.modal').on('loaded.bs.modal', function (e) {        
    $(".upload_file").hide();
    $(".show_hide").show();

    $('.show_hide').click(function(){
        $(".upload_file").slideToggle();    
    });

       //jquery validation goes here...
}); 

我在這里想念的是什么，希望你們能提供幫助。 TIA。

Answer 1

您正在創建多個點擊事件，每次打開模式時都會創建一個新的事件。

更改

$('.show_hide').click(function(){
    $(".upload_file").slideToggle();    
});

至

$('.show_hide').off('click').on('click', function(){
    $(".upload_file").slideToggle();    
});

這將殺死第一次單擊事件，然后重新綁定它。

或者，您可以將click事件的綁定移出模態初始化，以便僅調用一次。

Answer 2

$('body').on('click','.show_hide',function(){
    $(".upload_file").slideToggle();    
});