Question

我正在尝试实现简单的JSfiddle示例：http://jsfiddle.net/HjJBZ/

然而，当我将它加载到我的网站（而不是JSFiddle！）时，它无法正常工作。我检查了控制台，似乎说：

未捕获的TypeError：无法读取属性＆＃39; ready＆＃39; null（匿名函数）@ VM2075：1Xd @ g：108Ah @ g：176gh @ g：163（匿名函数）@ g：164（匿名函数）@g：125（匿名函数）@ g：101（匿名函数） @ g：20（匿名函数）@ 1025104082-3？mr = t1433769737＆amp; mi =＆＃39; 2.2082777797.1433755870147＆＃39;＆amp; mt =！n＆amp; cs =！t

我的HTML代码是：

<style type="text/css">button#show2 {
  background-color: #323470;
  color: #fff;
  padding-top: 4%;
  padding-bottom: 4%;
  padding-left: 22%;
  padding-right: 22%;
}
#two {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 97%;
    height: 200px;
        background-color: #fff9d7;  
    border: 1px solid #e2c822;  
    color: #333333;  
    font-size: 13px;  
    font-weight: bold;  
    display: none;
    padding: 10px;
}
</style>
<button id="show2">Finance Available &gt;&gt;.</button>
<div id="two">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vitae augue libero. Nulla consequat leo malesuada condimentum rutrum. Vestibulum et mattis lacus. Nullam nec ex diam. Sed malesuada lorem quis tempus interdum. Nunc posuere ipsum vitae turpis luctus dapibus. Nam commodo efficitur justo, vitae gravida justo.</p>
</div>

我的JavaScript代码是：

 $('document').ready(function() {
    $('#show2').click(function() {
        $('#two').slideToggle();
    });
});

感谢您的帮助

Answer 1

您需要使用不带引号的$(document)。

目前您正在使用Element Selector ("element")。由于我们没有document元素，因此您的代码无效。

＆＃13;

$(document).ready(function() {
    $('#show2').click(function() {
        $('#two').slideToggle();
    });
});

＆＃13;

button#show2 {
  background-color: #323470;
  color: #fff;
  padding-top: 4%;
  padding-bottom: 4%;
  padding-left: 22%;
  padding-right: 22%;
}
#two {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 97%;
  height: 200px;
  background-color: #fff9d7;
  border: 1px solid #e2c822;
  color: #333333;
  font-size: 13px;
  font-weight: bold;
  display: none;
  padding: 10px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="show2">Finance Available &gt;&gt;.</button>
<div id="two">
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vitae augue libero. Nulla consequat leo malesuada condimentum rutrum. Vestibulum et mattis lacus. Nullam nec ex diam. Sed malesuada lorem quis tempus interdum. Nunc posuere ipsum vitae turpis
    luctus dapibus. Nam commodo efficitur justo, vitae gravida justo.</p>
</div>

＆＃13;

Answer 2

尝试删除$('document')中的引号，否则当您使用selector元素时，它会搜索<document>个元素。：

 $(document).ready(function() {
    $('#show2').click(function() {
        $('#two').slideToggle();
    });
});

<强> JSFIDDLE DEMO

Answer 3

$（＆＃39;文档＆＃39;）选择器不正确。尝试$（文档），我已经测试了下面的内容并且工作正常

   $(document).ready(function(){
        $("#show2").click(function(){
            $("#two").slideToggle();
        });
    });

JSFiddle切换示例不起作用

3 个答案: