jQuery: jQuery में छिपे हुए तत्व की ऊंचाई प्राप्त करें

Question

मुझे एक तत्व की ऊंचाई प्राप्त करने की आवश्यकता है जो कि एक div के भीतर है जो छिपा हुआ है। अभी मैं div दिखाता हूं, ऊंचाई प्राप्त करता हूं, और माता-पिता div को छिपाता हूं। यह थोड़ा मूर्खतापूर्ण लगता है। क्या कोई बेहतर तरीका है?

मैं jQuery 1.4.2 का उपयोग कर रहा हूं:

$select.show();
optionHeight = $firstOption.height(); //we can only get height if its visible
$select.hide();

Comments

+1 आपका उदाहरण समाधान वास्तव में किसी भी उत्तर से बेहतर है।

— टिम सैंटेफोर्ड

मैं टिम से असहमत हूं। इस समाधान के साथ एक मौका है कि प्रदर्शन झिलमिलाहट हो सकता है क्योंकि आप वास्तव में आइटम दिखा रहे हैं और फिर इसे छिपा रहे हैं। भले ही Nicks समाधान अधिक जटिल है, यह प्रदर्शन को टिमटिमाना का कोई मौका नहीं है क्योंकि माता-पिता div कभी नहीं दिखाया गया है।

— हम्फ्री

jQuery के

— DocMax

संबंधित: stackoverflow.com/questions/3632120/…

— निक

हैरी, वास्तव में आपको क्या पता चला कि आपका कोड IE में काम नहीं करता है, न कि यह समाधान। अपना कोड डीबग करें :)

— गेविन

Answer 1

आप इस तरह से कुछ कर सकते हैं, हालांकि थोड़ा हैकी, भूल जाते हैं positionकि क्या यह पहले से ही निरपेक्ष है:

var previousCss  = $("#myDiv").attr("style");

$("#myDiv").css({
    position:   'absolute', // Optional if #myDiv is already absolute
    visibility: 'hidden',
    display:    'block'
});

optionHeight = $("#myDiv").height();

$("#myDiv").attr("style", previousCss ? previousCss : "");

Comments

मैंने एक jQ प्लगइन jsbin.com/ihakid/2 में उपरोक्त कोड को समेकित किया । मैं एक वर्ग का भी उपयोग करता हूं और जांचता हूं कि क्या माता-पिता भी छिपे हुए हैं।

— हितुटोडेस्ट्रक्ट

+1 यह बहुत अच्छा काम करता है। बस ध्यान रखें कि तत्व के माता-पिता को भी प्रदर्शित किया जाना चाहिए। इसने मुझे कुछ मिनटों के लिए उलझन में डाल दिया था। इसके अलावा, यदि तत्व है position:relative, तो आप निश्चित रूप से इसके बजाय सेट करना चाहते हैं static।

— बजे माइकल मिओर

जब आप इस विधि का उपयोग करते हैं, तो लक्ष्य तत्व अक्सर आकार बदल सकता है। तो जब यह पूरी तरह से तैनात हो तो div की ऊँचाई और / या चौड़ाई प्राप्त करना बहुत उपयोगी नहीं हो सकता है।

— जेरेमी रिकेट्स

@Gavin यह एक reflow गणना और उपयोगकर्ता के लिए किसी भी झिलमिलाहट को रोकता है, इसलिए यह सस्ता और कम घुसपैठ दोनों है।

— निक Craver

@hitautodestruct, मैंने आपके क्वेरी प्लगइन को केवल इस बात की जांच करने के लिए संशोधित किया है कि वास्तव में तत्व छिपा हुआ है। jsbin.com/ihakid/58

— प्रसाद

Answer 2

मैं छिपी हुई तत्व चौड़ाई प्राप्त करने के साथ उसी समस्या में भाग गया, इसलिए मैंने इसे ठीक करने के लिए jQuery वास्तविक कॉल को लिखा । के बजाय का उपयोग करने का

$('#some-element').height();

उपयोग

$('#some-element').actual('height');

आपको छिपे हुए तत्व के लिए सही मूल्य देगा या तत्व में एक छिपे हुए माता-पिता हैं।

पूर्ण प्रलेखन कृपया यहाँ देखें । पेज में एक डेमो भी शामिल है।

उममीद है कि इससे मदद मिलेगी :)

Comments

हाँ, यह मदद करता है! 2015 और यह अभी भी मदद करता है। आप वास्तविक वेबसाइट पर "जक्वरी के पुराने संस्करण" कहते हैं - हालांकि - यह अभी भी v2.1.3 में आवश्यक है, कम से कम यह मेरी स्थिति में था।

— LpLrich

धन्यवाद! मैंने इस प्लगइन का उपयोग तत्वों की ऊंचाई को पढ़ने और सेट करने के लिए किया है (यह गतिशील रूप से किया गया है) शुरूआत में accordions के भीतर छिपा हुआ है

— alds

बहुत बढ़िया प्लगइन! मैंने 100% पर सेट होने पर एक मोडल के अंदर एक div की चौड़ाई प्राप्त करने के लिए सब कुछ करने की कोशिश की और कुछ भी काम नहीं किया। इसे 5 सेकंड में सेट करें और पूरी तरह से काम करें!

— क्रेग हॉवेल

@ben लिंक टूट गया है।

— सचिन प्रसाद

Answer 3

आप दो सीएसएस शैलियों, प्रदर्शन शैली और दृश्यता शैली को भ्रमित कर रहे हैं ।

यदि दृश्यता सीएसएस शैली सेट करके तत्व छिपा हुआ है, तो आपको यह सुनिश्चित करने में सक्षम होना चाहिए कि तत्व दिखाई दे रहा है या नहीं, क्योंकि तत्व अभी भी पृष्ठ पर जगह लेता है या नहीं ।

यदि तत्व को डिस्प्ले सीएसएस स्टाइल को "नो" में बदलकर छिपाया गया है, तो वह तत्व पेज पर जगह नहीं लेता है, और आपको इसे एक प्रदर्शन शैली देनी होगी, जिससे तत्व कुछ जगह पर रेंडर हो जाएगा जो बिंदु, आप ऊंचाई प्राप्त कर सकते हैं।

Comments

इसके लिए धन्यवाद। मेरी समस्या में एक तालिका सेल शामिल था , और मेरी समस्या को हल करने के visibilityलिए सेटिंग hiddenनहीं थी, लेकिन इसने मुझे सेट करने का विचार दिया position: fixed; top: 100%और यह एक आकर्षण की तरह काम करता है!

— Jayen

अब मुझे समझ में आया कि प्रदर्शन के साथ ऊँचाई क्यों नहीं दिखाई देती: कोई भी तत्व नहीं। अद्भुत स्पष्टीकरण के लिए बहुत बहुत धन्यवाद।

— FrenkyB

Answer 4

मैंने वास्तव में कई बार इससे निपटने के लिए थोड़े से छलावे का सहारा लिया है। मैंने एक jQuery स्क्रॉलबार विजेट विकसित किया है जहाँ मुझे इस समस्या का सामना करना पड़ा है कि मैं समय से पहले नहीं जानता कि स्क्रॉल करने योग्य सामग्री मार्कअप के छिपे हुए टुकड़े का हिस्सा है या नहीं। यहाँ मैंने क्या किया है:

// try to grab the height of the elem
if (this.element.height() > 0) {
    var scroller_height = this.element.height();
    var scroller_width = this.element.width();

// if height is zero, then we're dealing with a hidden element
} else {
    var copied_elem = this.element.clone()
                      .attr("id", false)
                      .css({visibility:"hidden", display:"block", 
                               position:"absolute"});
    $("body").append(copied_elem);
    var scroller_height = copied_elem.height();
    var scroller_width = copied_elem.width();
    copied_elem.remove();
}

यह अधिकांश भाग के लिए काम करता है, लेकिन एक स्पष्ट समस्या है जो संभावित रूप से सामने आ सकती है। यदि आपके द्वारा क्लोन की जा रही सामग्री को CSS के साथ स्टाइल किया गया है, जिसमें उनके नियमों में पैरेंट मार्कअप के संदर्भ शामिल हैं, तो क्लोन की गई सामग्री में उपयुक्त स्टाइलिंग नहीं होगी, और संभवतः थोड़े अलग माप होंगे। इसके आस-पास जाने के लिए, आप यह सुनिश्चित कर सकते हैं कि जिस मार्कअप की आप क्लोनिंग कर रहे हैं, उसमें सीएसएस के नियम लागू हैं, जिसमें पैरेंट मार्कअप के संदर्भ शामिल नहीं हैं।

इसके अलावा, यह मेरे स्कॉलर विजेट के साथ मेरे लिए नहीं आया, लेकिन क्लोन किए गए तत्व की उचित ऊंचाई पाने के लिए, आपको मूल तत्व की चौड़ाई को चौड़ाई सेट करने की आवश्यकता होगी। मेरे मामले में, एक सीएसएस चौड़ाई हमेशा वास्तविक तत्व पर लागू होती थी, इसलिए मुझे इस बारे में चिंता करने की ज़रूरत नहीं थी, हालांकि, अगर तत्व में चौड़ाई लागू नहीं है, तो आपको किसी प्रकार की पुनरावृत्ति करने की आवश्यकता हो सकती है उचित मूल तत्व की चौड़ाई का पता लगाने के लिए तत्व के डोम वंश का ट्रैवर्सल।

Comments

हालांकि यह एक दिलचस्प समस्या है। यदि तत्व पहले से ही एक ब्लॉक तत्व है, तो क्लोन पूरे शरीर की चौड़ाई (बॉडी पैडिंग या मार्जिन को छोड़कर) लेगा, जो कंटेनर के अंदर आकार की तुलना में अलग है।

— Meligy

Answer 5

जेएसबिन पर उपयोगकर्ता निक के उत्तर और उपयोगकर्ता हाईटूटोडस्ट्रक्ट के प्लगइन पर आगे निर्माण करते हुए, मैंने एक समान jQuery प्लगइन बनाया है जो चौड़ाई और ऊंचाई दोनों को पुनर्प्राप्त करता है और इन मूल्यों वाले ऑब्जेक्ट को वापस करता है।

यह यहाँ पाया जा सकता है: http://jsbin.com/ikogez/3/

अपडेट करें

मैंने इस छोटे से छोटे प्लगइन को पूरी तरह से बदल दिया है क्योंकि यह पता चला है कि पिछले संस्करण (ऊपर उल्लेख किया गया था) वास्तव में वास्तविक जीवन के वातावरण में उपयोग करने योग्य नहीं था जहां बहुत सारे डोम हेरफेर हो रहे थे।

यह पूरी तरह से काम कर रहा है:

/**
 * getSize plugin
 * This plugin can be used to get the width and height from hidden elements in the DOM.
 * It can be used on a jQuery element and will retun an object containing the width
 * and height of that element.
 *
 * Discussed at StackOverflow:
 * http://stackoverflow.com/a/8839261/1146033
 *
 * @author Robin van Baalen <[e-mail]>
 * @version 1.1
 * 
 * CHANGELOG
 *  1.0 - Initial release
 *  1.1 - Completely revamped internal logic to be compatible with javascript-intense environments
 *
 * @return {object} The returned object is a native javascript object
 *                  (not jQuery, and therefore not chainable!!) that
 *                  contains the width and height of the given element.
 */
$.fn.getSize = function() {    
    var $wrap = $("<div />").appendTo($("body"));
    $wrap.css({
        "position":   "absolute !important",
        "visibility": "hidden !important",
        "display":    "block !important"
    });

    $clone = $(this).clone().appendTo($wrap);

    sizes = {
        "width": $clone.width(),
        "height": $clone.height()
    };

    $wrap.remove();

    return sizes;
};

Comments

आपका कोड सही नहीं है। आप की जरूरत है मूल आइटम है, जो दिखाई नहीं देता है को दर्शाता है। sizes = {"width": $wrap.width(), "height": $wrap.height()};this

— jackJoe

@jackJoe मैं बिना मुद्दों के काफी समय से इस कोड का उपयोग कर रहा हूं। सबसे अच्छा मैं कहूँगा कि मुझे 'इस' के बजाय $ क्लोन.ऑक्सर्विज़न () की आवश्यकता है। $ रैप नहीं है क्योंकि मैं लपेट के अंदर तत्व का आकार चाहता हूं। रैपर 10000x10000px हो सकता है जबकि मैं जिस तत्व को मापना चाहता हूं वह अभी भी 30x40px है उदाहरण के लिए।

— रॉबिन वैन बालन

यहां तक ​​कि लक्ष्य निर्धारण $wrapठीक है (कम से कम मेरे परीक्षणों में)। मैंने कोशिश की thisऔर जाहिर है कि यह आकार नहीं पकड़ेगा क्योंकि thisअभी भी छिपे हुए तत्व को संदर्भित करता है।

— जैकजो

धन्यवाद @jackJoe मैंने अब कोड उदाहरण को अपडेट किया है।

— रॉबिन वैन बालन

Answer 6

निक के जवाब पर आगे की इमारत:

$("#myDiv").css({'position':'absolute','visibility':'hidden', 'display':'block'});
optionHeight = $("#myDiv").height();
$("#myDiv").css({'position':'static','visibility':'visible', 'display':'none'});

मैंने पाया कि ऐसा करना बेहतर है:

$("#myDiv").css({'position':'absolute','visibility':'hidden', 'display':'block'});
optionHeight = $("#myDiv").height();
$("#myDiv").removeAttr('style');

CSS विशेषताएँ सेट करना उन्हें इनलाइन सम्मिलित करेगा, जो आपके CSS फ़ाइल में मौजूद अन्य विशेषताओं को अधिलेखित कर देगा। HTML तत्व पर शैली की विशेषता को हटाकर, सब कुछ वापस सामान्य और अभी भी छिपा हुआ है, क्योंकि यह पहली जगह में छिपा हुआ था।

Comments

$("#myDiv").css({'position':'absolute','visibility':'hidden', 'display':'block'}); optionHeight = $("#myDiv").height(); $("#myDiv").css({'position':'','visibility':'', 'display':''});

— हारून

... जब तक आप पहले से ही तत्व पर इनलाइन शैलियों नहीं थे। यदि आप jQuery के साथ तत्व को छिपाते हैं तो यह मामला होगा।

— मुहम्मद

Answer 7

आप डिस्प्ले का उपयोग करने के बजाय एक नकारात्मक मार्जिन के साथ स्क्रीन के छिपे हुए भाग को बंद कर सकते हैं: कोई भी, टेक्स्ट इंडेंट इमेज रिप्लेसमेंट तकनीक जैसा नहीं।

जैसे।

position:absolute;
left:  -2000px;
top: 0;

इस तरह ऊंचाई () अभी भी उपलब्ध है।

Answer 8

मैं छिपे हुए तत्व के लिए काम करने वाले फ़ंक्शन को खोजने की कोशिश करता हूं, लेकिन मुझे लगता है कि सीएसएस बहुत जटिल है जो हर किसी को लगता है। CSS3 में बहुत सी नई लेआउट तकनीकें हैं जो लचीले बॉक्स, ग्रिड, कॉलम या यहां तक ​​कि मूल मूल तत्व के अंदर पिछले सभी उत्तरों के लिए काम नहीं कर सकती हैं।

फ्लेक्सिबॉक्स उदाहरण

मुझे लगता है कि एकमात्र स्थायी और सरल समाधान वास्तविक समय प्रतिपादन है । उस समय, ब्राउज़र को आपको सही तत्व आकार देना चाहिए ।

अफसोस की बात है कि जब तत्व दिखाया या छिपाया गया है, तो उसे सूचित करने के लिए जावास्क्रिप्ट कोई प्रत्यक्ष घटना नहीं देता है। हालाँकि, मैं DOM एट्रीब्यूट मॉडिफाइड API के आधार पर कुछ फ़ंक्शन बनाता हूं जो तत्व की दृश्यता बदलने पर कॉलबैक फ़ंक्शन को निष्पादित करेगा।

$('[selector]').onVisibleChanged(function(e, isVisible)
{
    var realWidth = $('[selector]').width();
    var realHeight = $('[selector]').height();

    // render or adjust something
});

अधिक जानकारी के लिए, कृपया मेरे प्रोजेक्ट GitHub पर जाएँ।

https://github.com/Soul-Master/visible.event.js

डेमो: http://jsbin.com/ETiGIre/7

Comments

आपके उत्तर के लिए धन्यवाद। इसने मुझे MutationObservers का भी उपयोग करने के लिए प्रेरित किया। लेकिन ध्यान दें कि आपका पुस्तकालय केवल styleविशेषता परिवर्तनों के कारण दृश्यता परिवर्तन के लिए जाँच करता है (लाइन 59 यहाँ देखें ), जबकि दृश्यता परिवर्तन classविशेषता में परिवर्तन के कारण भी हो सकता है ।

— अशरफ साबरी

आप सही हे। सही कथन e.attributeName होना चाहिए! == 'style' && e.attributeName! == 'className'

— Soul_Master

Answer 9

निक क्रेवर के समाधान के बाद, तत्व की दृश्यता सेट करना सटीक आयाम प्राप्त करने की अनुमति देता है। मैंने इस समाधान का उपयोग बहुत बार किया है। हालांकि, शैलियों को मैन्युअल रूप से रीसेट करने के बाद, मैं इस बोझिल को खोजने आया हूं, यह देखते हुए कि विकास के माध्यम से मेरी सीएसएस में तत्व की प्रारंभिक स्थिति / प्रदर्शन को संशोधित करना, मैं अक्सर संबंधित जावास्क्रिप्ट कोड को अपडेट करना भूल जाता हूं। निम्न कोड प्रति कहना शैलियों को रीसेट नहीं करता है, लेकिन जावास्क्रिप्ट द्वारा जोड़ी गई इनलाइन शैलियों को हटा देता है:

$("#myDiv")
.css({
    position:   'absolute',
    visibility: 'hidden',
    display:    'block'
});

optionHeight = $("#myDiv").height();
optionWidth = $("#myDiv").width();

$("#myDiv").attr('style', '');

यहाँ केवल धारणा यह है कि अन्य इनलाइन शैलियाँ नहीं हो सकती हैं या फिर उन्हें भी हटा दिया जाएगा। हालांकि, इसका लाभ यह है कि तत्व की शैलियों को वे सीएसएस स्टाइलशीट में वापस कर दिया गया है। नतीजतन, आप इसे एक फ़ंक्शन के रूप में लिख सकते हैं जहां एक तत्व गुजरता है, और एक ऊंचाई या चौड़ाई वापस आ जाती है।

एक और मुद्दा मैंने js के माध्यम से शैलियों को इनलाइन स्थापित करने के लिए पाया है कि जब css3 के माध्यम से संक्रमणों से निपटते हैं, तो आप अपने स्टाइल नियमों के वज़न को एक इनलाइन शैली से अधिक मजबूत बनाने के लिए मजबूर हो जाते हैं, जो कभी-कभी निराशाजनक हो सकता है।

Answer 10

परिभाषा के अनुसार, एक तत्व में केवल ऊँचाई होती है यदि वह दिखाई देता है।

बस जिज्ञासु: आपको एक छिपे हुए तत्व की ऊंचाई की आवश्यकता क्यों है?

एक विकल्प यह है कि किसी तत्व को प्रभावी ढंग से पीछे (z-index का उपयोग करके) किसी प्रकार का ओवरले छिपाकर रखा जाए।

Comments

मुझे एक तत्व की ऊंचाई की आवश्यकता है, जो कि उस समय के दौरान छिपी होनी चाहिए जब मैं इसकी ऊंचाई चाहता हूं। मैं एक प्लगइन का निर्माण कर रहा हूं और मुझे कुछ डेटा इकट्ठा करने की आवश्यकता है क्योंकि मैं इसे init करता

— हूं

एक और कारण जावास्क्रिप्ट के साथ चीजों को केंद्रित करने के लिए है जो अभी तक दिखाई नहीं दे सकता है

— साइमन_वेवर

@ क्लेटस यदि आप केवल टिप्पणियों को लिखने के लिए उत्सुक हैं, तो एक छिपे हुए तत्व का आकार प्राप्त करने के लिए दृश्यपटल कोडिंग में अक्सर स्थिति होती है।

— रेंटीव

Answer 11

मेरी परिस्थिति में मेरे पास एक छिपा हुआ तत्व भी था जो मुझे ऊंचाई मान प्राप्त करने से रोक रहा था, लेकिन यह तत्व स्वयं नहीं था, बल्कि इसके माता-पिता में से एक था ... इसलिए मैंने सिर्फ अपने एक प्लग इन की जाँच के लिए यह देखने के लिए रखा कि क्या यह है छिपे हुए हैं, और निकटतम छिपे हुए तत्व को ढूंढते हैं। यहाँ एक उदाहरण है:

var $content = $('.content'),
    contentHeight = $content.height(),
    contentWidth = $content.width(),
    $closestHidden,
    styleAttrValue,
    limit = 20; //failsafe

if (!contentHeight) {
    $closestHidden = $content;
    //if the main element itself isn't hidden then roll through the parents
    if ($closestHidden.css('display') !== 'none') { 
        while ($closestHidden.css('display') !== 'none' && $closestHidden.size() && limit) {
            $closestHidden = $closestHidden.parent().closest(':hidden');
            limit--;
        }
    }
    styleAttrValue = $closestHidden.attr('style');
    $closestHidden.css({
        position:   'absolute',
        visibility: 'hidden',
        display:    'block'
    });
    contentHeight = $content.height();
    contentWidth = $content.width();

    if (styleAttrValue) {
        $closestHidden.attr('style',styleAttrValue);
    } else {
        $closestHidden.removeAttr('style');
    }
}

वास्तव में, यह आपको ग्रेगरी की बेहतर विधि का उपयोग करने के लिए निक, ग्रेगोरी और आईलैडलेसनेस की प्रतिक्रियाओं का एक समामेलन है, लेकिन दोनों ही तरीकों का उपयोग करने के मामले में शैली की विशेषता में कुछ ऐसा माना जाता है जिसे आप वापस लाना चाहते हैं, और ढूंढते हैं एक मूल तत्व।

मेरे समाधान के साथ मेरी एकमात्र पकड़ यह है कि माता-पिता के माध्यम से पाश पूरी तरह से कुशल नहीं है।

Answer 12

एक समाधान यह है कि जिस तत्व को आप प्राप्त करना चाहते हैं, उसके बाहर एक पैरेंट डिव बनाएं और '0' की ऊंचाई लागू करें और किसी भी ओवरफ्लो को छिपाएं। अगला, बाल तत्व की ऊंचाई लें और माता-पिता की अतिप्रवाह संपत्ति को हटा दें।

var height = $("#child").height();
// Do something here
$("#parent").append(height).removeClass("overflow-y-hidden");

.overflow-y-hidden {
  height: 0px;
  overflow-y: hidden;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="parent" class="overflow-y-hidden">
  <div id="child">
    This is some content I would like to get the height of!
  </div>
</div>

Answer 13

यहां एक स्क्रिप्ट है जो मैंने छिपे हुए तत्वों के लिए jQuery के आयाम के सभी तरीकों को संभालने के लिए लिखा था, यहां तक ​​कि छिपे हुए माता-पिता के वंशज भी। ध्यान दें, निश्चित रूप से, इसका उपयोग करके एक प्रदर्शन हिट है।

// Correctly calculate dimensions of hidden elements
(function($) {
    var originals = {},
        keys = [
            'width',
            'height',
            'innerWidth',
            'innerHeight',
            'outerWidth',
            'outerHeight',
            'offset',
            'scrollTop',
            'scrollLeft'
        ],
        isVisible = function(el) {
            el = $(el);
            el.data('hidden', []);

            var visible = true,
                parents = el.parents(),
                hiddenData = el.data('hidden');

            if(!el.is(':visible')) {
                visible = false;
                hiddenData[hiddenData.length] = el;
            }

            parents.each(function(i, parent) {
                parent = $(parent);
                if(!parent.is(':visible')) {
                    visible = false;
                    hiddenData[hiddenData.length] = parent;
                }
            });
            return visible;
        };

    $.each(keys, function(i, dimension) {
        originals[dimension] = $.fn[dimension];

        $.fn[dimension] = function(size) {
            var el = $(this[0]);

            if(
                (
                    size !== undefined &&
                    !(
                        (dimension == 'outerHeight' || 
                            dimension == 'outerWidth') &&
                        (size === true || size === false)
                    )
                ) ||
                isVisible(el)
            ) {
                return originals[dimension].call(this, size);
            }

            var hiddenData = el.data('hidden'),
                topHidden = hiddenData[hiddenData.length - 1],
                topHiddenClone = topHidden.clone(true),
                topHiddenDescendants = topHidden.find('*').andSelf(),
                topHiddenCloneDescendants = topHiddenClone.find('*').andSelf(),
                elIndex = topHiddenDescendants.index(el[0]),
                clone = topHiddenCloneDescendants[elIndex],
                ret;

            $.each(hiddenData, function(i, hidden) {
                var index = topHiddenDescendants.index(hidden);
                $(topHiddenCloneDescendants[index]).show();
            });
            topHidden.before(topHiddenClone);

            if(dimension == 'outerHeight' || dimension == 'outerWidth') {
                ret = $(clone)[dimension](size ? true : false);
            } else {
                ret = $(clone)[dimension]();
            }

            topHiddenClone.remove();
            return ret;
        };
    });
})(jQuery);

Comments

पलकविहीनता से जवाब मुझे क्या चाहिए के लिए एकदम सही लगता है, लेकिन मैं जिस jQuery के साथ काम नहीं कर रहा हूँ वह चल रहा है: 1.3.2 यह jQuery को फेंक देता है इस a.clone (या कुछ बहुत करीब) एक फ़ंक्शन नहीं है। किसी को भी इसे ठीक करने के बारे में कोई विचार है?

Answer 14

यदि आपने पहले ही पृष्ठ पर पहले ही तत्व प्रदर्शित कर दिया है, तो आप सीधे DOM तत्व से सीधे ऊँचाई ले सकते हैं (। JQuery के साथ .get (0) में पहुंचना), क्योंकि यह तब भी सेट है जब तत्व छिपा हुआ है।

$('.hidden-element').get(0).height;

चौड़ाई के लिए समान:

$('.hidden-element').get(0).width;

(सुधार के लिए स्कीट ओ'रिली का धन्यवाद)

Comments

वापसीundefined

— जेक विल्सन

बहुत यकीन है कि यह केवल तभी काम करता है जब आपने पहले ही पृष्ठ पर तत्व प्रदर्शित किया हो। ऐसे तत्वों के लिए जो हमेशा से रहे हैं display='none', यह काम नहीं करेगा।

— स्कीट्स