动态添加输入框是不是动态绑定

我使用的是呼吁的document.ready从这个链接Jquery的输入近代化功能： http://webdesignerwall.com/tutorials/cross-browser-html5-placeholder-text 动态添加输入框是不是动态绑定

在我的JavaScript代码，我加入2个输入框的DOM 。如何动态绑定这些输入对象，以便它们展示与文档准备就绪时存在的输入框相同的功能。

var add= '<input type="text" size="75" placeholder="This is a Comment" id="txtComment" />' 
+ '<br /><input type="text" placeholder="2012-03-24" id="txtDate" /><br /><button id="submit">Submit</button>'; 

$(this).html(addTargetForm); 


function modernizer_init() { 
    if (!Modernizr.input.placeholder) { 

     $('[placeholder]').onfocus(function() { 
      var input = $(this); 
      if (input.val() == input.attr('placeholder')) { 
       input.val(''); 
       input.removeClass('placeholder'); 
      } 
     }).blur(function() { 
      var input = $(this); 
      if (input.val() == '' || input.val() == input.attr('placeholder')) { 
       input.addClass('placeholder'); 
       input.val(input.attr('placeholder')); 
      } 
     }).blur(); 
     $('[placeholder]').parents('form').submit(function() { 
      $(this).find('[placeholder]').each(function() { 
       var input = $(this); 
       if (input.val() == input.attr('placeholder')) { 
        input.val(''); 
       } 
      }) 
     }); 

    } 
}

来源

2012-03-06 Garrett

请给出绑定原始功能的代码。 – 2012-03-06 02:02:43

请发布您的绑定代码。 – Eli 2012-03-06 02:03:13

添加到主要部分。 – Garrett 2012-03-06 02:35:20

这应该直接工作结构内部，而是通过各种手段把它放在一个function modernizer_init() {}如果这就是你的应用需求。

的javascript：

$("body").on('focusin', '[placeholder]', function(evt) { 
    var $input = $(evt.target); 
    if ($input.val() == $input.attr('placeholder')) { 
     $input.val(''); 
     $input.removeClass('placeholder'); 
    } 
}).on('focusout', '[placeholder]', function(evt) { 
    var $input = $(evt.target); 
    if ($input.val() == '' || $input.val() == $input.attr('placeholder')) { 
     $input.addClass('placeholder'); 
     $input.val($input.attr('placeholder')); 
    } 
}).on('submit', 'form', function(evt) { 
    var $form = $(evt.target); 
    $form.find('[placeholder]').each(function() { 
     var $input = $(this); 
     if ($input.val() == $input.attr('placeholder')) { 
      $input.val(''); 
     } 
    }); 
}); 
$('[placeholder]').focusout();

这是通过委托的focusIn（焦点）和事件的内容（模糊）的处理事件文档正文（或者，如果你喜欢一个更本土的容器），这是jQuery的1.7 .1实施现在不赞成使用的方式bind(),.live()和.delegate()。

查看起作用：http://jsfiddle.net/wg2eX/2/

来源

2012-03-06 08:51:58

动态添加输入框是不是动态绑定

回答

相关问题