爲什麼這個.slideToggle函數在jQuery中不起作用？

-3

所以，我有一些問題，下面的代碼：爲什麼這個.slideToggle函數在jQuery中不起作用？

<div class="chat" style="display: none;"> 
    <input type="text" class="chat-name" placeholder="Enter your name"> 
    <div class="chat-messages"></div> 
    <textarea class="chat-textarea" placeholder="Type your message"></textarea> 
    <div class="chat-status">Status: <span>Idle</span></div> 
</div> 
<div id="showmenu">Click Here</div> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js"></script> 
<script> 
    $('#showmenu').click(function() { 
     $('.chat').slideToggle("fast"); 
    }); 
}); 
</script>

正如你所看到的，它應觸發.chat DIV，但事實並非如此。

任何幫助非常感謝！

來源

2015-03-03 Chris Dekker

請發表小提琴？ – 2015-03-03 07:30:15

你有錯配的右花括號，刪除它們，它的工作正常：http://jsfiddle.net/hshmrvLs/ – 2015-03-03 07:31:19

@FrebinFrancis：把上面的代碼放到一個小提琴（或更好，一個堆棧片段），並複製問題就好了。 – 2015-03-03 07:34:29

因爲腳本末尾還有一個額外的});。刪除它，和它的作品：

<div class="chat" style="display: none;"> 
 
    <input type="text" class="chat-name" placeholder="Enter your name"> 
 
    <div class="chat-messages"></div> 
 
    <textarea class="chat-textarea" placeholder="Type your message"></textarea> 
 
    <div class="chat-status">Status: <span>Idle</span></div> 
 
</div> 
 
<div id="showmenu">Click Here</div> 
 
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
 
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js"></script> 
 
<script> 
 
    $('#showmenu').click(function() { 
 
     $('.chat').slideToggle("fast"); 
 
    }); 
 
}); 
 
</script>

您的瀏覽器使得它平凡容易診斷這樣的錯誤。打開Web控制檯，你會看到一個錯誤，如

Uncaught SyntaxError: Unexpected token }

帶有指向該行的鏈接。一般來說，瀏覽器中內置的全功能調試工具應該是您嘗試使用JavaScript代碼來弄清楚發生了什麼（以及發生了什麼問題）的第一站。

來源

2015-03-03 07:31:31

您應該刪除多餘的})

<script> 
    $('#showmenu').click(function() { 
     $('.chat').slideToggle("fast"); 
    }); 
</script>

包裝這種代碼在DOM準備是一個很好的做法。

<script> 
$(document).ready(function(){ 
    $('#showmenu').click(function() { 
     $('.chat').slideToggle("fast"); 
    }); 
}); 
</script>

來源

2015-03-03 07:31:43 void

使用此

<script> 
    $('#showmenu').click(function() { 
     $('.chat').slideToggle("fast"); 
    }); 
</script>

來源

2015-03-03 07:35:38

好@Regent我改變了它 – 2015-03-03 07:41:26

爲什麼這個.slideToggle函數在jQuery中不起作用？

回答

相關問題