1

私はこれを半日以上続けていますが、何が欠けているのか理解できません。私は多くの異なる反復と私が見つけることができる他のすべての解決策を試しました。それは簡単なはずです。私はJQueryMobile1.2を使用しており、その依存関係は次のとおりです（注var counter = 2; はコードの上で宣言されています：

    $("#btn_addIngredient").click(function () {      
        if (counter > 10) {
            alert("Please limit to 10 ingredients");
            return false;
        }   

        var newIngredientTextBox = $(document.createElement('div')).attr("id", 'div_ingredient' + counter);         

        newIngredientTextBox.after().html('<input type="text" name="ingredient' + counter + 
              '" id="ingredient' + counter + '" value="#' + counter + '" >');

        newIngredientTextBox.appendTo("#allIngredientsDiv"); 
        counter++;

    }); //~ $("#btn_addIngredient")

そしてhtml：

     <div id="IngredientsTextGroup" data-role="fieldcontain">
            <fieldset id="IngredientsFieldset" data-role="controlgroup" data-mini="true">
            <div id="allIngredientsDiv">
                Ingredients
                <div id="div_ingredient1">
                    <input id="ingredient1" value="#1" type="text">
                </div>

                <!-- *** Need to add <div_ingredient2, 3 ...>  -->

            </div>
            <a id="btn_addIngredient" href="#" data-role="button" data-inline="true" data-icon="plus"
                             data-iconpos="left">
                Add Ingredient
            </a>
    <div>
4

2 に答える 2

2

.after（）を間違って使用しています。選択した要素の後に要素を配置する場合は、これを実行します。

newIngredientTextBox.after('<input type="text" name="ingredient' + counter + 
          '" id="ingredient' + counter + '" value="#' + counter + '" />');

div要素内に配置する場合は、.append（）を使用できます。

newIngredientTextBox.append('<input type="text" name="ingredient' + counter + 
          '" id="ingredient' + counter + '" value="#' + counter + '" />');

また、要素をdomに追加した後、要素を追加する必要があります。

newIngredientTextBox.appendTo("#allIngredientsDiv").after('<input type="text" name="ingredient' + counter + 
          '" id="ingredient' + counter + '" value="#' + counter + '" />');
于 2012-12-10T21:14:23.177 に答える
0

試す

var counter = 2;
var newIngredientTextBox = $(document.createElement('div')).attr("id", 'div_ingredient' + counter);         
console.info(newIngredientTextBox);
newIngredientTextBox.after('<input type="text" name="ingredient' + counter +  '" id="ingredient' + counter + '" value="#' + counter + '" >');

その後、追加されたhtmlは機能しません

于 2012-12-10T21:13:32.660 に答える