2011-02-27 52 views
0

嘿家伙我试图在最终用户点击提交 密钥时更新div元素。简单的div更新与jquery&ajax

所以我有这样的代码:

 <div class="duruGetPhone"> <input type="submit" name="upload" value="submit" class="something" /> </div> 
     <script> 
     $(document).ready(function() { 
      $('input.something').click(function(e) { 
       e.preventDefault(); 
       $('div.duruGetPhone').load('loadImage.php', {param1: '<?php echo $Hood; ?>', param2: '<?php echo $Id; ?>'}); 
      }); 
     }); 
     </script> 

,如果我使用的一个标签或“跨度”,但对于输入不工作也能正常工作。 它实际上更新了div,但没有执行提交。如果我 不使用“preventDefault”然后没有任何反应。有人可以对这个问题有所了解吗?

+0

你是什么意思进行提交但更新div?提交被阻止,只有更新div将被执行或更新将被执行,但你不会看到它,因为未被阻止的提交会刷新页面? – Luke 2011-02-27 23:33:18

+0

对于Luke和kim3er:我希望提交按钮得到更新的原因是因为用户提交的图像需要很长时间才能退出,我希望提交按钮在图像加载时消失 – Tom 2011-02-28 00:07:20

回答

1

假设您的示例被封装在窗体标签中,我有一个可能的解释。

如果没有preventDefault,点击事件处理程序会被触发,但会被发布到服务器的表单截断,所以load函数永远不会完成。

随着preventDefault,点击事件处理程序触发并获得成功结论。但是,默认行为(表单提交)已被禁用。

为什么你想要表单回发到服务器除了点击事件?我误解了一些东西吗?

如果你想点击触发事件,作为一个成功的表单提交的结果,我会调查插件http://jquery.malsup.com/form/控制异步使用ajaxSubmitajaxForm回发的使用jQuery的表格。

0

如果我知道你想正确的内容(提交表单,放在DIV响应,并禁用按钮,而这一切都发生的事情)我会使用上面提到的表格插件:

http://jquery.malsup.com/form/

...,做这样的事情(未经测试,但应该是在球场):

<script> 
$(document).ready(function() { 
    $("#myform").ajaxForm({ 
     target: "div.duruGetPhone", 
     beforeSubmit: function(responseText, statusText) { 
     $("input.something").disable(); 
     } 
    }); 
}); 
</script> 

<form id="myform" method="post" action="loadImage.php"> 
    <input type="hidden" name="param1" value="<?php echo $Hood; ?>"/> 
    <input type="hidden" name="param1" value="<?php echo $Id; ?>"/> 
    <div class="duruGetPhone"> 
     <input type="submit" name="upload" value="submit" class="something" /> 
    </div> 
</form> 

然后loadImage.php只需要返回你想要插入duruGetPhone IMG标记。