Скрыть и показать функциональность не работает

Я делаю и показываю функциональность Я пробовал сценарии, но он не работает, Пожалуйста, дайте мне знать, что я сделал.Скрыть и показать функциональность не работает

Мой код:

function showButtons() { 

    $("#view").click(function(){ 
     $("#allversion").show(); 
    }); 
    $("#view").click(function(){ 
     $("#allversion").hide(); 
    }); 
} 

<div id="allversion" style="display:none"> 
    SOME DISPLY CODE HERE 
</div>

дайте мне знать изменения мне нужно, чтобы сделал

<a onclick="showButtons()" id="view">View More</a>

источник

2017-01-26 vinay

Может jsfiddle? – noitse

Используйте фрагмент сценария редактора, пожалуйста. – ppasler

[w3school] (http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_eff_toggle) хороший пример –

Проблема заключается в том, что каждый раз при вызове функции showButtons, которая связывает дополнительные события 2 щелчка каждый раз (так, нажав на ссылку в 2 раза у вас будет 4 события в общей сложности). И ваш код показывает и скрывает элемент одновременно.

Вам нужно переключить его:

$(document).ready(function() { 
 
    $('#view').click(function() { 
 
    $('#allversion').slideToggle(); 
 
    }); 
 
});

#allversion { 
 
    display: none; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<a id="view">View More</a> 
 
<div id="allversion">VISIBLE!</div>

источник

2017-01-26 07:26:32 Justinas

Это работает со мной.

<!DOCTYPE html> 
<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
<script> 
function showButtons() { 


     $("#allversion").toggle(); 

} 

</script> 
</head> 
<body> 

<div id="allversion" > 
    SOME DISPLY CODE HERE 
</div> 

<a onclick="showButtons()" id="view">View More</a> 
</body> 
</html>

источник

2017-01-26 07:24:24

Я рекомендую использовать метод toggle. Проблема в том, что вам нужно использовать один обработчик события click.

$("#view").click(function(e){ 
 
    $("#allversion").toggle(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="allversion" > 
 
    SOME DISPLY CODE HERE 
 
</div> 
 
<a id="view">View More</a>

источник

2017-01-26 07:24:33

изменения на следующий код, он должен работать.

<a id="view">View More</a> 

var isClicked = false; 
$("#view").click(function() { 
    if (isClicked == true) { 
    $("#allversion").css("display", "none"); 
    isClicked = false; 
    } 
    else { 
    $("#allversion").css("display", "inline"); 
    isClicked = true; 
    } 
});

Также вы можете использовать .toggle() для переключения видимости.

<a id="view">View More</a> 

$("#view").click(function() { 
    $("#allversion").toggle(); 
});

источник

2017-01-26 07:29:33 anguspcw

Для этого не нужно вызывать событие onclick = "showButtons()". Вы можете легко скрыть и показать свой раздел что-то вроде этого:

$(document).ready(function(){ 
    $("#view").click(function(){ 
     $("#allversion").toggle(); 
    }); 
});

источник

2017-01-26 07:30:27

Вы можете использовать переключатель, как предложено другими, или вы можете попробовать это

$("#view").click(function(){ 
if($("#allversion").hasClass('show')) 
{ 
    $("#allversion").removeClass('show').addClass('hide'); 

} 
else 
{ 
    $("#allversion").removeClass('hide').addClass('show'); 

}

источник

2017-01-26 07:33:48

согласно вашему вопросу «Почему это не мой код за работой?".

Если ваш код точно такой же, как на вашем сайте, он не работает, потому что скрипт инициализируется до загрузки DOM.

Переместить сценарий в нижней части страницы или положить его в к

$(document).ready(function(){ 
    //Code goes here 
});

источник

2017-01-26 08:09:33 Gezzasa

Скрыть и показать функциональность не работает

ответ

Смежные вопросы