اضافه کردن و حذف کردن تگ به صورت داینامیک

سلام خدمت دوستان ، من می خوام وقتی کاربر عددی را در کادر تعداد وارد می کنه ، بر اساس عدد وارد شده ،تگ درست کنه و وقتی عدد داخل کادر تغییر کنه ، تگ های قبلی پاک شده و بر اساس عدد جدید تگ ایجاد کنه .



فایل HTML :

کد HTML:

---

<div class="Field" id="Field">
<p>
                <label>تعداد</label>
                <input  style="width:50px;" type="text" id="txtCount" onchange="CreateElement(value)" />
                </p>
</div>

---

تابع جاوا اسکریپت :

function CreateElement(count)

{

    

      var element= document.getElementById("Field");       

    var i=1;       

    if(count==0 || count=="")      

    {      

        return null;            

    }     

    while(count)         

    {         

        var p=document.createElement("p");                   

        //------------------- label                      

        var label=document.createElement("label");                     

        var text = document.createTextNode('گزینه'+' '+i);                     

        //------------------- input                      

        var input=document.createElement("input");                   

        input.style.width="60px;";                     

        input.type = "text";                   

        input.id="vote"+i;                  

        //---------------------------                             

        label.appendChild(text);                      

        p.appendChild(label);                        

        p.appendChild(input);                      

        element.appendChild(p);                      

        i++;                       

        count--;                    

    }                   

        

    

}

مشکلم اینجاست که وقتی عددی جدید در کادر وارد می کنم تگ های قبلی پاک نمی شوند ( در واقع نتونستم این بخش از کدش رو بنویسم ) دوستان کسی راهنمایی کنه ممنون می شم.

همه ی تگ هایی که جدید میسازی رو به یک تگ اصلی بده ( مثلا با ID=container ) و بعد محتویات اون تگ رو حذف کن.

document.getElementById('container').innerHTML = '';

با تشکر از hakan648 تابعش این میشه ولی تو IE کار نمی کنه که فکر کنم مشکل از IE باشه :

function CreateElement(count)

{

    

    var element= document.getElementById("Field");

    var exists = document.getElementById("newdiv");

    if(exists!=null)

    {

        exists.remove(this);

    }

    if(count==0 || count=="")

    {

        return null;

    }

    

    

    //-------- 

    var newdiv = document.createElement("div");

    newdiv.id="newdiv";

    //-------------------

    var i=1;

    while(count)

    {

            var p=document.createElement("p");

            //------------------- label

            var label=document.createElement("label");

            var text = document.createTextNode('گزینه'+' '+i);

            //------------------- input

            var input=document.createElement("input");

            input.style="width:60px;";

            input.type = "text";

            input.id="vote"+i;

            //---------------------------

            label.appendChild(text);

            p.appendChild(label);

            p.appendChild(input);

            newdiv.appendChild(p);

                

            i++;

            count--;

            

    }

    element.appendChild(newdiv);

    

}

نقل قول:

---

با تشکر از hakan648 تابعش این میشه ولی تو IE کار نمی کنه که فکر کنم مشکل از IE باشه

---

تابعش چی میشه؟

من کد شمارو بررسی نکردم و نیازی هم به بررسی نداره. سوال شما در مورد حذف کردن محتویات یک المنت هست و بنده هم کد درست رو ارائه کردم خدمتتون.
متوجه نمیشم چرا با وجود اون کد شما همچنان از تابع دیگری ( remove ) استفاده میکنید که معلوم نیست چیه و از کجا اومده.


توضیحات و سازگاری خصوصیت innerHTML با مرورگرهای رایج:

HTML DOM innerHTML Property

نمونه ای هم که نوشتم رو در لینک زیر ملاحظه کنید.
http://jsfiddle.net/tNCL5/6/

من می خواستم بعد از یک سری تگ ها در یک div ، تگ اضافه یا حذف کنم ، من زیاد با جاوا اسکریپت آشنا نیستم .

خب باید با جاوا اسکریپت آشنا بشید. من یه روش خیلی ساده به شما معرفی کردم. به نظرم از اول این چند خط کدتون رو بنویسید و سعی کنید با ساختار بهتری این کار رو انجام بدید.
در این صورت هم فهم بهتری از برنامه پیدا خواهید کرد و هم تغییرات بعدی ساده تر خواهد شد.

اگر لینکی که دادم رو مشاهده کرده باشید، من کار اصلی که میخواید رو انجام دادم، با این تفاوت که کد شما پیچیدگی بیشتری داره و یه سری کار اضافه تر انجام میشه.