Créer une étiquette en utilisant jQuery à la volée

J'ai besoin de créer une étiquette et un champ de texte à la volée et également inclure datepicker pour le textfield. J'ai besoin de quelque chose comme ceci:

<label for="from">From </label> <input type="text" id="from" name="from" />

J'ai essayé quelque chose comme ça en jQuery:

var label = $("<label>").attr('for', "from");   
                    label.html('Date: ' +
                        '<input type="text" id="from name="from" value="">');

                    $(function() {
                        $("#from").datepicker();
                    });

Cela d'une certaine façon de ne pas créer l'étiquette et aussi le champ de texte. Je ne suis pas sûr de ce que je suis absent.

MODIFIER

Pour être plus précis, je suis en utilisant ce dans les portlets et je n'ai pas de corps de balises dans la page jsp. Alors quand j'ai appeler la fonction à ajouter à corps il ne sera pas.

source d'informationauteur user525146

  1. 24

    Quelque chose de ce genre:

    //Create the label element
var $label = $("<label>").text('Date:');
//Create the input element
var $input = $('<input type="text">').attr({id: 'from', name: 'from'});

//Insert the input into the label
$input.appendTo($label);
//Insert the label into the DOM - replace body with the required position
$('body').append($label);

//applying datepicker on input
input.datepicker();

    jsFiddle Démo

    Veuillez noter que vous n'avez pas à utiliser l' for attribut sur l'étiquette si l'élément d'entrée est à l'intérieur. Donc, utiliser l'un de ces:

    <label><input id="x1"></label>

<label for="x1"></label> <input id="x1">
  2. 3

    Vous aurez besoin d'attacher l'étiquette que vous avez créée pour le DOM pour l'obtenir:

    var label = $("<label>").attr('for', "from");
    label.html('Date: ' +
      '<input type="text" id="from name="from" value="">');

label.appendTo('body');

//set up datepicker
label.find('#from').datepicker();
  3. 1

    Où vous voulez insérer l'étiquette? Si vous le souhaitez, au début de la page, vous pouvez faire quelque chose comme cela.

    var $label = $("<label>").attr('for', "from");   

$label.html('Date: <input type="text" id="from" name="from" value="">');

$(function() {
    $('body').prepend($label);

    $(':input', $label).datepicker();
});
  4. 0

    1) il Vous manque des cours de clôture à la fin de l'attribut ID.

    2) Vous n'avez pas ajouter l'étiquette elle-même à quoi que ce soit.