कैसे से पहले बच्चे संलग्न करने के लिए। प्रोटोटाइप

वोट
25

मैं जावास्क्रिप्ट पुस्तकालय के साथ एक वेबसाइट बना रही है। उपयोगकर्ता एक ड्रॉप-डाउन पर एक विकल्प का चयन करते (चुनें) बॉक्स पर कोई लेबल और एक पाठ बॉक्स वहाँ जोड़ा जाना चाहिए। यह मैं appendChild विकल्प के साथ करते हैं। appenChild विकल्प के साथ ही समस्या यह है कि आइटम हमेशा इस्तेमाल किया तत्व में आइटम के बाद जोड़ा जा रहा है। यह मेरा कोड है:

var newFreeformLabel = document.createElement('label');
newFreeformLabel.innerHTML = 'Omschrijving:';
var newFreeformField = document.createElement('input');
newFreeformField.className = 'textfield';
newFreeformField.name = 'factuur_orderregel[]';
var newFreeformSpacer = document.createElement('div');
newFreeformSpacer.className = 'spacer';

container.appendChild(newFreeformLabel);
container.appendChild(newFreeformField);
container.appendChild(newFreeformSpacer);

यहाँ कंटेनर तत्व जहां आइटम जोड़ा जाना चाहिए है। केवल समस्या यह है कि आइटम तत्व के अंत पर जोड़ रहे हैं और मैं HTML तत्व की शुरुआत पर आइटम जोड़े रखना चाहते हैं।

06/03/2009 को 07:47
का स्रोत उपयोगकर्ता
अन्य भाषाओं में...                            


5 जवाब

वोट
8

उपयोग Element.insert (तत्व, सामग्री)

06/03/2009 को 07:50
का स्रोत उपयोगकर्ता

वोट
1
container.
    insert({
        // key is position
        // 'before', 'after', 'top' and 'bottom' are allowed
        top: new Element('label').
            update('Omschrijving:')
    }).
    insert({
        top: new Element('input').
            addClassName('textfield').
            writeAttribute('name', 'factuur_orderregel[]')
    }).
    insert({
        top: new Element('div').
            addClassName('spacer')
    });

मुझे लगता है कि प्रोटोटाइप के Element.insertलिए कुछ हद तक अजीब है before/ afterफिर भी,। उदाहरण के लिए, यदि आप जगह करना चाहता था .spacerइससे पहले कि .textfieldबाद में अपने कोड में, कुछ समय के लिए, आप की तरह कुछ करने के लिए की आवश्यकता होगी:

container.
    down('.textfield').
    insert({
        before: new Element('div').
            addClassName('spacer')
    });

यह विशेष रूप से यदि आप डोम एपीआई से परिचित हैं, है Element.insertBeforeके रूप में आप कर रहे हैं, कुछ हद तक unintuitive नहीं डालने .spacerमें .textfield, लेकिन इसके बजाय में container, पहले.textfield

06/03/2009 को 08:12
का स्रोत उपयोगकर्ता

वोट
82

साथ ही appendChild, डोम नोड्स एक है insertBefore विधि

container.insertBefore(newFreeformLabel, container.firstChild);
06/03/2009 को 08:30
का स्रोत उपयोगकर्ता

वोट
0

अगर मैं समय पर गैरेथ के समाधान देखा था, मैं, उस के साथ जा सकते हैं के रूप में यह मैं का इस्तेमाल किया गया था:

$('toggle_product').innerHTML = insertContent + $('toggle_product').innerHTML;

प्रोटोटाइप 'डालने के रूप में () फ़ंक्शन IE8 में त्रुटि लौट रहा था ..

07/05/2012 को 10:46
का स्रोत उपयोगकर्ता

वोट
0
container.prepend(newChild);

यह ES5 में जोड़ा गया है। यह वेनिला जे एस और वर्तमान में उपलब्ध है ब्राउज़रों के 70% क्रोम, एफएफ, और ओपेरा भी शामिल है।

इसके अलावा, newFreeformLabel.after(newFreeformField);आप, क्रम में डालने के लिए अगर वांछित अनुमति होगी। .beforeभी एक विकल्प है

लिंक: developer.mozilla.org - polyfill

13/08/2017 को 02:02
का स्रोत उपयोगकर्ता

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more