JQuery按鈕處理

Question

我不能讓按鈕工作，真的失去了什麼問題。

<script>$(document).ready(function() { 
$("signup-button").click(function() { 
    console.log("hello"); 
}); 
});</script> 

<div class="username-input form-horizontal"> 
    <!-- <div class="form-group"> --> 
    <label for="inputUsername" class="col-sm-2 control-label">Username</label> 
    <div class="col-sm-5"> 
    <input type="text" class="form-control" id="inputUsername" placeholder="Username"> 
    </div> 
    </div> 
    <button class="signup-button col-sm-1 control-label">Sign in </button> 

Answer 1

您缺少班級選擇器.。 $("signup-button")將查找具有標記名註冊按鈕的元素。因此您應該使用$(".signup-button")：

$(document).ready(function() { 
    $(".signup-button").click(function() { 
    console.log("hello"); 
    }); 
}); 

Answer 2

問題是您的選擇器。您使用的是element selectorsignup-button看起來與標記名signup-button像<signup-button>..</signup-button>的元素，但在你的情況signup-button是一個類名，所以你需要通過ID使用class selector

$(document).ready(function() { 
 
    $(".signup-button").click(function() { 
 
    console.log("hello"); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="username-input form-horizontal"> 
 
    <!-- <div class="form-group"> --> 
 
    <label for="inputUsername" class="col-sm-2 control-label">Username</label> 
 
    <div class="col-sm-5"> 
 
    <input type="text" class="form-control" id="inputUsername" placeholder="Username"> 
 
    </div> 
 
</div> 
 
<button class="signup-button col-sm-1 control-label">Sign in</button>

Answer 3

使用select 。使用＃

<script type="text/javascript"> 
 
      $(document).ready(function() { 
 
       $("#signup").click(function() { 
 
        console.log("hello"); 
 
        alert("hello"); 
 
       }); 
 
      }); 
 

 
     </script>

<div class="username-input form-horizontal"> 
 
      <!-- <div class="form-group"> --> 
 
      <label for="inputUsername" class="col-sm-2 control-label">Username</label> 
 
      <div class="col-sm-5"> 
 
       <input type="text" class="form-control" id="inputUsername" placeholder="Username"> 
 
      </div> 
 
     </div> 
 
     <button class="signup-button col-sm-1 control-label" id="signup">Sign in </button> 
 
    </body>