将jQuery占位符添加到动态创建的表单元素 [英] Adding jQuery placeholders to dynamically created form elements

问题描述

有没有人成功将IE8的jQuery占位符文本添加到动态创建的表单元素中。

例如，我点击一个按钮，出现一个通过AJAX加载的表单，我需要用占位符文本打开新表单。

我尝试过使用jQuery .live，.bind，.on等等，但它们在创建时都没有捕获新元素。

我也尝试将它放置在点击功能中，以便当它们点击按钮时，激活占位符功能。

（pre> $（'input [placeholder]'）。on（focus，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（）。parents（'form'）。submit（function（）{
$（this）.find（'input [placeholder]'）。each（function（）{
var input = $ （this）;
if（input.val（）== input.attr（'placeholder'））{
input.val（''）;
}
}）
}）;


解决方案

  $（文件）.on（{
 focus：function（）{
 var input = $（this）; 
 if（input.val（）== input.attr（'placeholder'）） {
 input.val（''）; 
 input.removeClass（'placeholder'）; 
} 
}，
 blur：function（）{
 input input = $（this）; 
 if（input.val（）==''|| input.val（）== input.attr（'placeholder'））{
 input.addClass （'placeholder'）; 
 input.val（input.attr（'placeholder'））; 
} 
} 
}，input [placeholder]）; 
 
 $ b $（document）.on（submit，form，function（）{
 $（this）.find（'input [placeholder]'）。每个（函数（）{
 var input = $（this）; 
 if（input.val（）== input.attr（'placeholder'））{
 input.val（' '）; 
} 
}）; 
}）; 
 
 $（'input [placeholder]'）。blur（）; 
  

让我知道这个重构是否有效。

Has anyone successfully added jQuery placeholder text for IE8 to dynamically created form elements.

For example, I click a button and a form appears that is loaded through AJAX, I need to hit the new form with placeholder text.

I have tried using jQuery .live, .bind, .on etc... but neither are catching the new elements when they are created.

I've also tried placing it in a click function so that when they click the button the placeholder function is activated.

$('input[placeholder]').on("focus", 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().parents('form').submit(function() {
    $(this).find('input[placeholder]').each(function() {
        var input = $(this);
        if (input.val() == input.attr('placeholder')) {
            input.val('');
        }
    })
});

解决方案

$(document).on({
    focus: 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'));
        }
    }
},"input[placeholder]");


$(document).on("submit","form",function() {
    $(this).find('input[placeholder]').each(function() {
        var input = $(this);
        if (input.val() == input.attr('placeholder')) {
            input.val('');
        }
    });
});

$('input[placeholder]').blur();

Let me know if this refactoring works.

这篇关于将jQuery占位符添加到动态创建的表单元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！