jQuery监视表单字段由AJAX查询创建

时间:2010-04-21 00:17:11

标签: ajax jquery

前言:我确信这非常简单,但我搜索了这个网站& jQuery网站,无法找出正确的搜索词来获得答案 - 请原谅我的无知!

我正在使用jQuery的ajax函数添加其他表单字段,然后需要将其他ajax函数应用于这些字段,但似乎无法让jQuery在飞行表单字段中监视这些字段。

如何让jQuery使用这些新字段?

$(document).ready(function() {
   $('#formField').hide();
   $('.lnk').click(function() {
      var t = this.id;
      $('#formField').show(400);
      $('#form').load('loader.php?val=' + t);
   });

      //This works fine if the field is already present
      var name  = $('#name');
      var email = $('#email');
      $('#uid').keyup(function () {
         var t = this; 
         if (this.value != this.lastValue) {
            if (this.timer) clearTimeout(this.timer);             
            this.timer = setTimeout(function () {
               $.ajax({
                  url: 'loader.php',
                  data: 'action=getUser&uid=' + t.value,         
                  type: 'get',
                  success: function (j) {
                     va = j.split("|");
                     displayname  = va[1];
                     mail         = va[2];
                     name.val(displayname);
                     email.val(mail);
                  }
               });
            }, 200);  
            this.lastValue = this.value;
         }
      });
}); 

因此,如果在基本的html页面中存在该函数,但是如果它通过$ .load函数到达它不会 - 可能是因为$(document).ready已经开始。

我确实尝试过:

$(document).ready(function() {
   $('#formField').hide();
   $('.lnk').click(function() {
      var t = this.id;
      $('#formField').show(400);
      $('#form').load('loader.php?val=' + t);
      prepUid();
   });
});

function prepUid(){
      var name  = $('#name');
      var email = $('#email');
     $('#uid').keyup(function () {
snip...........

但它似乎没有用......

2 个答案:

答案 0 :(得分:2)

我认为你很亲密。一旦.load调用完成,您需要添加您的keyup处理程序。尝试改变这个......

  $('#form').load('loader.php?val=' + t);
  prepUid();

对此...

  $('#form').load('loader.php?val=' + t, null, prepUid);

答案 1 :(得分:2)

您正在寻找的是jquery live function。

  

为现在或将来与当前选择器匹配的所有元素的事件附加处理程序

您可以这样做:

$('.clickme').live('click', function() {// Live handler called.});

然后使用DOM添加内容

$('body').append('<div class="clickme">Another target</div>');

当您单击上面添加的div时,它将按预期使用静态加载的dom节点触发单击处理程序。

您可以在此处阅读更多内容:http://api.jquery.com/live/