2015-12-17 4 views
-1
var resultsList = $("#test"); 
resultsList.text("Hello. This is jQuery!"); 

var tB = jQuery("#toggleButton"); 

tB.on("click", function() { 
    resultsList.toggle(400); 
}); 

Я считаю, что синтаксис верен, потому что консоль браузера не сообщает о какой-либо ошибке.jQuery toggle не работает

При загрузке страницы переключатель работает не так, как ожидалось. Любая идея, что мне здесь не хватает?

Мой HTML является:

<div id="results" class="bordered-image"> 
    <button id="#toggleButton">Hide</button> 
    <div id="test">This is where results will live...eventually.</div>  
</div> 
+2

Если код включен в '' , или обернуть его в 'ready' или переместить его в нижней части' ', действительно ли это так? – Tushar

+1

, пожалуйста, дайте полный html здесь, потому что tooggle также хочет, чтобы HTML работал. –

+0

This is where results will live...eventually.
Sharktooth

ответ

0

id = "toggleButton" вместо id = "# toggleButton" будет делать.

+0

Тогда отметьте этот вопрос как типографскую ошибку ... Вместо того, чтобы заявить, что я уже говорил 20 минут назад. –

+0

Как флаг, я не знаю !! Можешь сказать мне ? Я могу сделать . –

+0

Я проголосовал за ваш комментарий !! Все в порядке? –

2

Поместите код Jquery в document.ready(), как это: Проверьте Fiddle также.

$(document).ready(function(){ 
     var resultsList = $("#test"); 
     resultsList.text("Hello. This is jQuery!"); 

     var tB = jQuery("#toggleButton"); 

     tB.on("click", function() { 
      resultsList.toggle(400); 
     }); 
    }); 

Ваш атрибут ID должен быть ID = "ToggleButton" вместо ID = "# ToggleButton"

HTML:

<div id="results" class="bordered-image"> 
    <button id="toggleButton">Hide</button> 
    <div id="test">This is where results will live...eventually.</div>  
</div> 
+0

Можете ли вы проверить HTML на скрипке. Надеюсь, что это нормально. Rt –

+0

Мой код по-прежнему не работает, несмотря на то, что он находится внутри функции готовности документа. Я загрузил свои файлы здесь по адресу: http://s000.tinyupload.com/download.php?file_id=01102376399704095945&t=0110237639970409594583731 (не уверен, что это самый безопасный метод) – Sharktooth

+1

Ваш HTML-код в порядке. Я имею в виду, что проблема с кодом OP могла быть из их HTML. –

0

Заверните его в готовой функции документа.

+3

Немного больше объяснений и примеров кода было бы лучше. – Abhi

0

см. Этот пример.

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title></title> 
</head> 
<body> 

<div id="results" class="bordered-image"> 
    <button id="toggleButton">Hide</button> 
    <div id="test">This is where results will live...eventually.</div>  
</div> 

</body> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
<script> 
$(document).ready(function(){ 
    var resultsList = $("#test"); 
    resultsList.text("Hello. This is jQuery!"); 
    $("#toggleButton").click(function() { 
     resultsList.toggle(400); 
    }); 
}); 
</script> 
</html> 

Благодаря Amit

0
<div id="results" class="bordered-image"> 
<button id="#toggleButton" onclick="myff();">Hide</button> 
<div id="test">This is where results will live...eventually.</div>  
</div> 

<script> 
function myff(){ 

    $("#test").toggle(); 
    } 

</script>