當div被切換時，已經切換的div不釋放

我被一些代碼困住了，而且我不清楚如何在不編寫大量代碼的情況下使其工作。這個想法是，當一個div切換顯示一個隱藏的文本，當你點擊另一個div時，該切換並且僅顯示另一個div。我知道如何手動執行它（使用代碼的船），但我想知道是否有一個「通用」的代碼行我可以粘貼在它後面。當div被切換時，已經切換的div不釋放

這裏是我的JS：

 $(document).ready(function(){ 
    $('#bioInfo').on('click', function(){ 
    $('#bioInfoText').toggle(); 
    }); 
    $('#bioTech').on('click', function(){ 
    $('#bioInfoText').toggle(); 
    }); 
    $('#bioFuture').on('click', function(){ 
    $('#bioFutureText').toggle(); 
    }); 
    $('#bioCont').on('click', function(){ 
    $('#bioContText').toggle(); 
    }); 
    $('#bioAdd').on('click', function(){ 
    $('#bioAddText').toggle(); 
    }); 
    $('#bioPrac').on('click', function(){ 
    $('#bioPracText').toggle(); 
    }); 
    $('#automInfo').on('click', function(){ 
    $('#automInfoText').toggle(); 
    }); 
    $('#automFuture').on('click', function(){ 
    $('#automFutureText').toggle(); 
    }); 
    $('#autom').on('click', function(){ 
    $('#automInfoText').toggle(); 
    }); 
    $('#automContent').on('click', function(){ 
    $('#automContentText').toggle(); 
    }); 
    $('#automAdd').on('click', function(){ 
    $('#automAddText').toggle(); 
    }); 
    $('#automPrac').on('click', function(){ 
    $('#automPracText').toggle(); 
    }); 
    $('#itInfo').on('click', function(){ 
    $('#itInfoText').toggle(); 
    }); 
    $('#it').on('click', function(){ 
    $('#itInfoText').toggle(); 
    }); 
    $('#itFuture').on('click', function(){ 
    $('#itFutureText').toggle(); 
    }); 
    $('#itCont').on('click', function(){ 
    $('#itContText').toggle(); 
    }); 
    $('#itAdd').on('click', function(){ 
    $('#itAddText').toggle(); 
    }); 
    $('#itPrac').on('click', function(){ 
    $('#itPracText').toggle(); 
    });

正如你可以看到它切換一個接一個，但如果我對個別點擊DIV手動，這不是隻在需要切換掉。

來源

2016-12-16 Gerrit ten Napel

您想接受任何答案嗎？您可以通過點擊答案旁邊的勾號按鈕來實現。你將能夠只做一個。 –

我意識到這一點，我只是想看看哪個解決方案有效，到目前爲止他們中沒有一個真的在做這個訣竅。 –

在不同的實現中使用它會更好。對於解決方案，這裏使用復位功能：

function resetAll() { 
    $('[id$="Text"]').hide(); 
    // Translates to: 
    $("#bioInfoText, #bioInfoText, #bioFutureText, #bioContText, #bioAddText, #bioPracText, #automInfoText, #automFutureText, #automInfoText, #automContentText, #automAddText, #automPracText, #itInfoText, #itInfoText, #itFutureText, #itContText, #itAddText, #itPracText").hide(); 
}

然後在每次點擊時調用resetAll()函數。

來源

2016-12-16 22:18:16

如果我是你，我只是想添加一個類到你想要使用的元素。然後，你可以做這樣的事情：

$('body').on('click', '.someClass', function(){ 
    var id = $(this).attr('id'); 
    $('.someClass').hide(); 
    $('.someClass #' + id + 'Text').show(); // Following your naming convention 
});

現在我不知道你的HTML的樣子，所以我不能說，如果它是100％正確的...但我認爲你的想法。

來源

2016-12-16 23:38:06 Chris

當div被切換時，已經切換的div不釋放

回答

相關問題