獲取jQuery的函數，在HTML按鈕觸發的OnClick

我有以下的HTML/JQuery的：獲取jQuery的函數，在HTML按鈕觸發的OnClick

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<title>Login</title> 
<script src="jQuery.js"></script> 
<script> 
    $(document).ready(function(){      
     $(function(){ 
     $("#sb").click(function(e){ 
      e.preventDefault(); 
      getmessage = "Yes"; 
      getmessage = encodeURIComponent(getmessage);//url encodes data 
      $.ajax({ 
       type: "POST", 
       url: "get_login.php", 
       data: {'getmessage': getmessage}, 
       dataType: "json", 
       success: function(data) { 
        $("#message_ajax").html("<div class='successMessage'>" + data.message +"</div>"); 
      } 
      }); 
     }); 
     }); 
    }); 
</script> 
</head> 

<body> 
<h1>Login</h1> 
<p>Please enter your e-mail and password</p> 
<form name = "loginform" action = "http://dev.speechlink.co.uk/David/get_login.php" method = "post"> 
<p>E-mail<input name = "username" type="text" size="25"/><label id ="emailStatus"></label></p> 

<p>Password<input name = "password" type="text" size="25"/><label id ="passwordStatus"></label></p> 

<p><input type="hidden" name="usertype" value = "SupportStaff" /></p> 
<p>><input type ="button" id = "sb"value="Create Account"/></p> 

</form> 
<div id = "message_ajax"></div> 
</body> 
</html>

我不能讓事件處理程序（jQuery的範圍內），一旦用戶按下「創建帳戶」按鈕，觸發...

來源

2011-08-15 user559142

你真的應該從屬性中刪除所有這些不規則的空間。在'.ready'中''（function（）{''是多餘的，因爲它做同樣的事情。 – pimvdb

知道單擊按鈕時會發生什麼實際上是有用的;沒有任何可見的事情發生，你會得到任何瀏覽器錯誤嗎？你是否收到來自AJAX調用的響應？事件實際上是否觸發？ –

按鈕的HTML似乎在某些地方有額外的空間，並且在「sb」值=「創建賬戶「。也就是說，爲什麼你將$（function（）{嵌入到$（document）.ready ...中，你的代碼已經被調用，只能在DOM準備好的情況下調用 – MaxiWheat

你的HTML不好：

<p>><input type ="button" id = "sb" value="Create Account"/></p>

應該

<p><input type ="button" id="sb" value="Create Account"/></p>

來源

2011-08-15 12:18:47 JohnJohnGa

我看到三個問題現成的蝙蝠：

你打電話ready兩次（當你傳遞一個函數到$()，它的就像傳遞一個函數到$(document).ready()）。這在很大程度上是無害的，但完全沒有必要。
您按鈕上的id的屬性與下一個相沖突;這是可能的瀏覽器忽略它：
```
<input type ="button" id = "sb"value="Create Account"/> 
 
```
（它的優良有=周圍的空間，如果你想要的，但具有"sb"夯成value可能無法正常工作。）
（可能摘話題，可能不是）：你似乎（從引用的代碼）被墮入The Horror of Implicit Globals。您應該聲明您的getmessage變量。

所以：

<script> 
    $(document).ready(function(){   
    // Removed the unnecessary `$(function() { ...` here and the matching closing bits at the end 
    $("#sb").click(function(e){ 
     e.preventDefault(); 
     var getmessage = "Yes"; // <== Added `var` 
     getmessage = encodeURIComponent(getmessage);//url encodes data 
     $.ajax({ 
      type: "POST", 
      url: "get_login.php", 
      data: {'getmessage': getmessage}, 
      dataType: "json", 
      success: function(data) { 
       $("#message_ajax").html("<div class='successMessage'>" + data.message +"</div>"); 
     } 
     }); 
    }); 
    }); 
</script>

和

<input type="button" id="sb" value="Create Account"/>

來源

2011-08-15 12:20:02

我測試了id和value屬性在IE9，FF5和Chrome 12中沒有空間，並且它在所有這三個方面都運行良好，可能它不適用於這些瀏覽器的早期版本，但我想這不是他寫的內容的唯一問題 –

@Anthony：我想不是。我似乎還記得，當我幾年前在某些代碼中看到它時，它的工作情況也是如此。 –

獲取jQuery的函數，在HTML按鈕觸發的OnClick

回答

相關問題