jQuery簡單的按鈕綁定

我是jQuery的新手，所以這應該是一個簡單的問題。jQuery簡單的按鈕綁定

據我瞭解，我可以綁定聽的事件，如點擊按鈕的方法，用

$('#buttonID').bind('click', function(){//some code});

然而，這不是爲我工作，所以我必須做錯事。

這是我簡單的HTML文件：

 <!doctype html> 
    <html> 
    <head> 
    <meta charset="utf-8"> 
    <title>Untitled Document</title> 
    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js'></script> 
    <script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js'></script> 
    <script src='test.js'></script> 
    </head> 

    <body> 
    <input id="SignIn" type="button" value="Sign In"></input> 
    </body> 
    </html>

除了加載jQuery的文件，它加載文件test.js，它看起來像這樣：

// JavaScript Document 
$('#SignIn').bind('click', function() {alert('hi');});

是不夠的約束力？我希望這會觸發一個警告對話框，但它不會，似乎回調不會被執行。

這裏有什麼問題？這兩個文件（html和js）都位於同一個目錄中，並且Google Chrome不會抱怨JavaScript控制檯中的任何內容，所以從這一點來看，一切都應該沒問題。

感謝您的幫助！

來源

2014-09-05 hansa

你需要一個'$（文件）.ready'功能，閱讀jQuery的文檔，它在幾乎每一個例子，一個是你將學到的第一件事。 – adeneo 2014-09-05 11:37:44

另外，使用'on'，而不是'bind' – adeneo 2014-09-05 11:38:03

@adeneo他正在使用jQuery 1.3.2隊友， – 2014-09-05 11:39:03

將你的代碼包裝在document ready處理程序中。它接受一個在DOM完全加載時執行的函數。

當你正在使用jQuery 1.3

$(document).ready(function() { 
    $('#SignIn').bind('click', function() { 
     alert('hi'); 
    }); 
});

的jQuery 1.7+，

$(document).ready(function() { 
    $('#SignIn').on('click', function() { 
     alert('hi'); 
    }); 
});

另外，在jQuery 1.7的，所述.on()方法是事件處理程序的附連到文檔的優選方法。

來源

2014-09-05 11:38:06 Satpal

啊，是的，快速和簡單的答案。謝謝！一旦SO允許我這樣做，將會標記爲答案。 – hansa 2014-09-05 11:39:37

$(function(){ 
    $('#SignIn').bind('click', function() {alert('hi');}); 
})

來源

2014-09-05 11:38:51 ainu

嘗試

$(function(){ 
    $('#SignIn').click(function() {alert('hi');}); 
});

來源

2014-09-05 11:38:53 kefy

$("#target").click(function() { 

//Write some code here 

});

來源

2014-09-05 11:39:36 user2412232

你可以試試這個。

$(document).ready(function(){ 
    $('#SignIn').on('click', function() {alert('hi');}); 

});

來源

2014-09-05 11:41:10 Dileep

請解釋OP的代碼有什麼問題，以及爲什麼通過編輯您的答案來解決問題。 – 2014-09-05 11:59:49

將您的Javascript移動到HTML頁面的底部，正好位於正文標籤的正上方。

通過這種方式，DOM在加載時就緒，並且不需要$(document).ready()調用。

https://developer.yahoo.com/performance/rules.html#js_bottom

來源

2014-09-05 11:41:34

您可能要包括你的JavaScript文件在最底層，並如預期正常工作了。建議這樣做，並在頂部包含CSS文件（頭標籤）。欲瞭解更多信息，請參閱@Grim包含的鏈接...

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Untitled Document</title> 
</head> 

<body> 
<input id="SignIn" type="button" value="Sign In"></input> 
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js'></script> 
<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js'></script> 
<script src='test.js'></script> 
</body> 
</html>

來源

2014-09-05 11:42:36 PeterKA

您可以使用它。

$(document).ready(function() { $("#SignIn").click(function() { alert('demo'); }); });

來源

2014-09-05 11:45:42 prog1011

＃user2606742 - 如果答案有用，請點擊'正確'並給'upvote'，這樣可以幫助其他人找出正確的解決方案。 – prog1011 2014-09-05 11:46:56

jQuery簡單的按鈕綁定

回答

相關問題