2011-10-05 16 views
6

मेरे पास एक एसवीजी दस्तावेज़ है, और मैं इसमें एक स्क्रिप्ट शामिल करने में सक्षम होना चाहता हूं (<script> टैग का उपयोग करके)। इस स्क्रिप्ट के अंदर मैं एक फ़ंक्शन सेट अप करना चाहता हूं जिसे दस्तावेज़ लोड होने पर और हेरफेर के लिए उपलब्ध होने पर कॉल किया जाएगा।एसवीजी: दस्तावेज लोड होने पर स्क्रिप्ट चलाएं

अगर मैं इसे HTML और JQuery के साथ कर रहा था तो मैं बस $(document).ready(...) का उपयोग करूंगा। मैं एक एसवीजी दस्तावेज के भीतर ऐसा करने के लिए देख रहा हूं लेकिन स्पष्ट रूप से मैं उसी तरह JQuery का उपयोग नहीं कर सकता।

test.svg:

<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg"> 
    <script type="text/ecmascript" xlink:href="myscript.js" /> 

    <!-- Rest of SVG body goes here --> 
</svg> 

myscript.js:

function init(evt) { 
    var svgDocument = evt.target.ownerDocument; 
    var svgRoot = svgDocument.documentElement; 
    // Manipulate SVG DOM here 
} 

// --> Somehow attach init() function to onload event of SVG <-- 

मैं चाहता हूँ

सारांश में, मैं के लिए क्या देख रहा हूँ की तरह कुछ है एक स्पष्टके आधार पर स्क्रिप्ट के भीतर इसे करने और करने के लिए एसवीजी परिभाषा में। (मैं एक स्क्रिप्ट लिखना चाहता हूं जिसे संभावित रूप से कई एसवीजी में शामिल किया जा सकता है, बिना किसी स्क्रिप्ट के काम के बारे में कोई जानकारी रखने की आवश्यकता होती है।)

उत्तर

2

शायद 'ऑनलोड' घटना है, जिसे आप ढूंढ रहे हैं। देखो here

+0

शायद, लेकिन मैं जावास्क्रिप्ट के माध्यम से उस घटना में हुक करने का तरीका ढूंढ रहा हूं, ** ** से ** एसवीजी (या कम से कम एक अलग फ़ाइल से '

6

यहाँ एक उदाहरण

<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg" onload='init(evt)'> 
<script type="text/ecmascript"> 
function init(evt) { 
var svgDocument = evt.target.ownerDocument; 
var svgRoot = svgDocument.documentElement; 
// Do whatever you like on svgRoot to manipulate your SVG DOM 
} 
</script> 
</svg> 
+0

धन्यवाद। यह वही है जो मैं प्राप्त करना चाहता हूं। हालांकि मैं जो करना चाहता हूं वह ' 'टैग में' ऑनलोड =" ... "' जोड़ने से बचें। मैंने यह स्पष्ट करने के लिए मूल प्रश्न अपडेट किया है (मुझे उम्मीद है!)। – FixMaker

2

कुछ भी नहीं है (लेकिन आईई) जे एस में मानक डोम ईवेंट हैंडलर्स एसवीजी में एम्बेडेड का उपयोग करने से बाधा:

document.addEventListener('load', init); 

IE के लिए, आप आमतौर पर उपयोग attachEvent या तो, लेकिन मुझे नहीं पता, अगर आईई (> = 9) एसवीजी में इसका समर्थन करता है।

अधिकतर, SVG फ़ाइलें तो DOMReady (उर्फ DOMContentLoaded) और इवेंट लोड नहीं कर रहे हैं, स्टैंडअलोन हैं इस दूर तो लोड का उपयोग करने से अंतर (एचटीएमएल, सीएसएस जहां फ़ाइलों और चित्रों के दर्जनों से लोड करना होगा। की तुलना में) एक DOMReady घटना (जो दुर्भाग्य से अभी तक स्थिर मानकीकृत नहीं है) की बजाय घटना उपेक्षित होगी। इसके अलावा मैंने कभी कोशिश नहीं की है, यदि ब्राउज़र भी एक डीओएमआरडी घटना को आग लगाते हैं, जब एसवीजी का डोम लोड होता है।

2

आप svg दस्तावेज़ के अंत में अपनी स्क्रिप्ट को शामिल करने का प्रयास कर सकते हैं, तो आपको लोड ईवेंट की प्रतीक्षा करने की आवश्यकता नहीं होगी। लेकिन यह विफल हो सकता है यदि आप दस्तावेज़ एंट में किसी भी बाहरी फाइल का संदर्भ दे रहे हैं, जब स्क्रिप्ट चलती है तो उन्हें पहले ही लोड नहीं किया गया है।

संबंधित मुद्दे