我有下面的代碼展開和隱藏所有內容展開和摺疊。我面臨的問題是個別項目沒有正確關閉。他們應該在FF和IE中正常工作。Jquery單獨切換在Firefox中無法正常工作
問題是當所有人都展開,你關閉一個人..它關閉第二個,即使你沒有點擊第二個。有一些不穩定性。試着在每次展開後關閉最後一個或第二個最後一個,然後關閉第二個隨機項或旁邊的第二個項。
它並不總是發生。在Firefox中的問題是顯而易見的
我真的很感謝你的幫助。
這裏是下面的代碼和小提琴和屏幕抓取
的Javascript
var prevId;
function showDiv(id) {
var infoDiv = "#" + id + "-moreinfo";
var plusDiv = "#" + id + "-plus";
var minusDiv = "#" + id + "-minus";
if($(infoDiv).is(":visible")){
removeHash();
$(plusDiv).show();
$(minusDiv).hide();
$(infoDiv).slideUp(200);
}else{
window.location.hash = id;
$(minusDiv).show();
$(plusDiv).hide();
$(infoDiv).slideDown(250);
}
if(prevId != undefined){
if(prevId.valueOf() != id.valueOf()){
$("#" + prevId + "-moreinfo").slideUp(200);
$("#" + prevId + "-plus").show();
$("#" + prevId + "-minus").hide();
}
}
prevId = id;
}
/***
* removeHash()
* Initiates an HTML5 feature to clean URL hashes.
* Requires HTML5 Standards or IE10 or higher. Safe fallback for older browsers.
**/
function removeHash(e){
/* pushState adds to the browser history, or replaceState which keeps the history uniformly clean */
if (history.replaceState){
/* HTML5 browsers, including IE10+ */
history.replaceState("", document.title, window.location.pathname + window.location.search);
} else {
/* Other browsers */
window.location.hash = '';
return false;
}
}
/***
* isNumber(value)
* Boolean function checking if value is numerical.
**/
function isNumber(n){
return !isNaN(parseFloat(n)) && isFinite(n);
}
/***
* Manupulates CSS to show css butons on expand and close. Also, expands and closes all violations
**/
$(document).ready(function(){
if (window.location.hash) {
/* Clean the hash, stripping out the preceding symbol, as showDiv() needs numbers */
var clean_hash = window.location.hash.replace('#','');
var text = $(this).text();
console.log("text " +text);
console.log("clean_hash " +clean_hash);
console.log("text ");
/* Check if the hash is a number before attempting to expand */
if (isNumber(clean_hash)) {
showDiv(clean_hash);
/* tiny wait before scrolling */
window.setTimeout(function() {
/* Uses jquery.scrollto library: http://balupton.github.io/jquery-scrollto/ */
//Scroll down to the item's h3 violation header text.
$('#post-'+prevId+' h3.viol-header').ScrollTo({
duration: 350,
easing: 'linear',
});
}, 800);
}
}
/**
** This shows the content when the user clicks on Expand all and also switches the plus and minus
**/
$("#Hide").hide();
$("#Show").click(function(e){
removeHash(e); //Reset the hash
$("div.moreinfo").slideDown(200);
$("div.plus").hide().removeClass("closed");;
$("div.minus").show().addClass("opened");
$("#Show").html("Expand All").addClass("expanded");
$("#Show").hide();
$("#Hide").show();
e.preventDefault();
});
/**
** This code hides the ontent when the user clicks on Expand all and also switches the plus and minus
**/
$("#Hide").click(function(e){
removeHash(e); //Reset the hash
$("div.moreinfo").slideUp(200);
$("div.plus").show().addClass("closed"); ;
$("div.minus").hide().removeClass("opened");
$(".message").html("Collapse All");
$("#Show").show();
$("#Hide").hide();
e.preventDefault();
});
});
似乎工作正常,如果你加載你的代碼在正確的地方http://jsfiddle.net/rtxmpq8h/47/ – j08691
我面臨的問題是,如果你注意到當你擴展所有。並嘗試單獨關閉它們。有時其他人也關閉。如何改正cna? – user244394
我在Chrome中看不到這種行爲。 – j08691