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不响应我的点击事件

回答

相关问题