jQuery不響應我的點擊事件

-1

**DEVELOPMENT.JS** 
jQuery(function ($) { 
$("#doContact").click(function(e) { 
    e.preventDefault(); 
    alert("ho"); // ---- It doesn't alert ---- 
    $("#contact-result").html('<img src="<%THEME%>images/loading.gif">'); 
    var formData = $("#registerForm").serialize(); 
    $.post("?page=register", formData, function(response) 
    { 
     if(response.status == 'success') 
     { 
      $.modal.close(); 
      $('#register-success').modal({ opacity:80 }); 
     } 
     else 
     { 
      $("#register-result").addClass('register-error'); 
      $("#register-result").html(response.error_message); 
     } 
    },'json'); 
}); 
}); 

**CONTACTFORM.HTML** 
<form id="contactForm" action="#" method="post" class="centered stylish"> 
     <div id="contact-result"> 
      <div> 
       <p><label for="username" class="label">Adınız:</label> 
       <input id="username" placeholder="Adınız..." name="username" maxlength="20" type="text" tabindex="1" class="input" /></p> 

       <p><label for="email" class="label">Email: (geri dönüş için gerekli)</label> 
       <input id="email" placeholder="Email adresiniz..." name="email" maxlength="70" type="text" tabindex="2" autocomplete="off" class="input"/></p> 

       <p><label for="message" class="label">Mesajınız:</label> 
       <textarea id="message" placeholder="Mesajınız..." cols="60" rows="10" name="message" maxlength="1000" type="text" tabindex="2" autocomplete="off" class="input"/></p> 

       <p> 
        <button id="doContact" class="ui-button button1" type="submit"> 
         <span class="button-left"> 
          <span class="button-right">Mesajımı Gönder</span> 
         </span> 
        </button> 
       </p> 
      </div> 
     </div> 
</form>

問題很簡單。jQuery不響應我的點擊事件

jQuery當前適用於其他頁面加載的div。（例如導航欄右上角的黃色登錄區域）

但是，此表單由AJAX調用加載，所以我相信我需要使用像delegate或live這樣的函數。不過，我不知道是不是這種情況。

你能看看嗎？

來源

2013-02-04 Lyver Kinkki

的解決方案是：

$(document).delegate("#doContact", "click", function(){

來源

2013-02-04 10:23:08

改變這一行：

$("#doContact").click(function(e) {

這樣：

$("#contactForm").submit(function(e) {

也改變了按鈕：<button id="doContact"到一個提交按鈕：<input type="submit">

編輯： 我不知道你是如何實現這一目標的，但是我如何做到這一點 - 這是有效的：

<div id="output"></div> 

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
<script> 
    // 1. Load the form.html file, and grab the form with an id of '#contactForm' 
    // 2. Insert the form with id '#contactForm' into the div with id '#output' 
    // 3. Submit the form 
    $('#output').load('form.html #contactForm', function (html, status, xhr) { 
     $('#contactForm').submit(function(e) { 
      e.preventDefault(); 
      alert('Form has been submitted!'); 
     }); 
    }); 
</script>

你form.html

<div class="leftArea centered"> 
    <h2>İletişim</h2> 
    <form id="contactForm" action="#" method="post" class="centered stylish"> 
      <div> 
       <p><label for="username" class="label">Adınız:</label> 
       <input id="username" placeholder="Adınız..." name="username" maxlength="20" type="text" tabindex="1" class="input" /></p> 

       <p><label for="email" class="label">Email: (geri dönüş için gerekli)</label> 
       <input id="email" placeholder="Email adresiniz..." name="email" maxlength="70" type="text" tabindex="2" autocomplete="off" class="input"/></p> 

       <p><label for="message" class="label">Mesajınız:</label> 
       <textarea id="message" placeholder="Mesajınız..." cols="60" rows="10" name="message" maxlength="1000" type="text" tabindex="2" autocomplete="off" class="input"/></p> 

       <p> 
        <input type="submit" value="Contact Me"> 
       </p> 
      </div> 
    </form> 
</div>

來源

2013-02-04 09:19:04 istos

不工作。它只有當我將jQuery移動到HTML文件時才起作用。 –

您現在正在使用jQuery 1.9.0，並且live（）在該版本中已棄用。嘗試改變你的jQuery版本： – istos

它不能解決問題。只有在將jQuery腳本移動到HTML文件中時，您的解決方案纔有效。它不能從.js文件中運行。我沒有使用實時的方式，使用委託，但它完全打破了我的jQuery。 –

嘗試使用：

$("#doContact").live("click",function(e) {

，而不是

$("#doContact").click(function(e) {

這應該對AJAX加載工作形式

來源

2013-02-04 09:27:24 Hazem

不工作。 :( –

jQuery不響應我的點擊事件

回答

相關問題