jquery 코드는 codepen/jsfiddle에서 작동하지만 HTML 페이지에서는 작동하지 않습니다

접을 수있는 jquery div에 대한 코드는 codepen과 JSFiddle에서 작동하지만 모든 내용을 내 페이지 (내용에 맞게)에 복사하면 div가 확장되지 않습니다. 나는 무엇을 놓치고, 어디서 잘못 되었습니까?jquery 코드는 codepen/jsfiddle에서 작동하지만 HTML 페이지에서는 작동하지 않습니다

<head> 
    <script src="//code.jquery.com/jquery-1.10.2.js"></script> 
    <script src="//code.jquery.com/ui/1.11.0/jquery-ui.js"></script> 

    <script type="text/javascript"> 
     $(".header").click(function() { 
      $header = $(this); 
      $content = $header.next(); 
      $content.slideToggle(500, function() { 
       $header.text(function() { 
        return $content.is(":visible") ? "Collapse" : "Expand"; 
       }); 
      }); 
     }); 
    </script> 
</head>

그리고 신체 내에서 내 콘텐츠 :

<form method="post" action="sales_report.php" enctype="multipart/form-data"> 
    //multiple <input /> fields here 
    <div class="container"> 
     <div class="header"><span>+Options</span></div> 
     <div class="content"> 
      <h3>Designate the Column of:</h3> 
      <p>Account Name</p> 
      <input required type="number" name="sales_report_col_acc" id="sales_report_col_acc" value='1' /> 
      <p>Sale Amount</p> 
      <input required type="number" name="sales_report_col_amt" id="sales_report_col_amt" value='2' /> 
      <p>Sale Date (optional)</p> 
      <input type="number" name="sales_report_col_date" id="sales_report_col_date" value='3' /> 
      </br /> 
     </div> 
    </div> 
    <input type="submit" name="sales_report_submit" value="Go" /> 
</form>

는이 문제를 해결하는 방법을 알려 주시기 바랍니다 다음과 같이

머리에 내 스크립트 태그 은? jquery와 함께 중요한 것을 놓친 것일까 요?

출처

2014-07-10 user3822774

당신은 준비 핸들러 내부의 코드를 포장 할 필요가

:이 웹 사이트는 할 때

$(document).ready(function(){ 
    //your code here 
});

또는

$(function(){ 
    //your code here 
});

출처

2014-07-10 03:27:27

덕분에 답을 체크 표시됩니다 나 – user3822774

@ user3822774 천만에요! –

jquery 코드는 codepen/jsfiddle에서 작동하지만 HTML 페이지에서는 작동하지 않습니다

답변

관련 문제