如何將 jQuery 添加到 html

Question

我試過這個：

<script src="js/jQuery.js"type="text/JavaScript"></script>

然后我嘗試在我的按鈕上單擊 function：

<script>
  $(document).ready(function (){
    function jfn1(){
      $("jbtn").fadetoggle()
    }
  })
</script>

Answer 1

我不確定您要實現什么，但是使用下面的代碼，單擊帶有 class 'jbtn' 的按鈕將使其淡出。

 $(document).ready(function (){ $('.jbtn').click(function() { $( this ).fadeToggle(); }); })

 <script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script> <button class="jbtn">Hey!</button>

Answer 2

歡迎來到 StackOverflow，Chisom。

你所做的只是定義 function，你實際上並沒有調用它。 它還需要是“ fadeToggle ”，而不是“ fadetoggle ”。

  /**
   * Define function to fade button in/out
   */
  function jfn1 () {
    $("jbtn").fadeToggle() // "fadeToggle", not "fadetoggle"
  }

  /**
   * On document ready (DOM loaded)
   */
  $(document).ready(function (){
    // Call function on document ready
    jfn1()
  })

這將在加載 DOM 樹時調用“fadeToggle”。 如果您想在單擊時調用它，它需要如下所示：

  /**
   * On document ready (DOM loaded)
   */
  $(document).ready(function (){
    // On button clicked
    $("jbtn").click(function () {
      // "this" is the function context
      // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this
      $(this).fadeToggle()  
    });
  })

此外$("jbtn")只會找到看起來像這樣的 HTML 元素： <jtbn>...</jtbn> 。 如果您想引用 class ( <HTML_ELEMENT class="jtbn"></HTML_ELEMENT>... )，您應該在其前面加上一個點，如下所示： $(".jbtn") 。

祝你好運！