একটি ডিভিটি ফাঁকা আছে কিনা তা পরীক্ষা করতে if স্টেটমেন্ট ব্যবহার করে


114

আমি একটি পৃথক ডিভ খালি থাকলে একটি নির্দিষ্ট ডিভ অপসারণ করার চেষ্টা করছি। আমি যা ব্যবহার করছি তা এখানে:

$(document).ready(function () {
    if ('#leftmenu:empty') {
        $('#menuTitleWrapper').remove();
        $('#middlemenu').css({ 'right': '0', 'position': 'absolute' });
        $('#PageContent').css({ 'top': '30px', 'position': 'relative' });
    }
});

আমি মনে করি এটি নিকটে তবে # বামফেনামুর পরীক্ষায় কোডটি কীভাবে লিখতে হবে তা ফাঁকা আছে তা আমি বুঝতে পারি না। কোন সাহায্য প্রশংসা করা হয়!

উত্তর:


271

আপনি ব্যবহার করতে পারেন .is()

if( $('#leftmenu').is(':empty') ) {
    // ...

অথবা আপনি কোনও lengthসম্পত্তি পাওয়া গেছে কিনা তা দেখতে কেবল সম্পত্তিটি পরীক্ষা করতে পারেন।

if( $('#leftmenu:empty').length ) {
    // ...

মনে রাখবেন যে খালি মানে কোনও সাদা জায়গা নয়। যদি এমন কোনও সুযোগ থাকে যে সেখানে সাদা স্থান থাকবে, তবে আপনি $.trim()সামগ্রীটির দৈর্ঘ্যটি ব্যবহার করতে এবং পরীক্ষা করতে পারেন ।

if( !$.trim( $('#leftmenu').html() ).length ) {
    // ...

3
trim()আমার জন্য নিখুঁত কাজ করে। শেয়ারপয়েন্টে এমন একটি কলাম সরিয়ে ফেলতে হবে যা কিছু সাদা স্থান যুক্ত করেছিল, যা trim()খুঁজে পেয়েছিল । ধন্যবাদ।
motoxer4533

1
নীচের হিসাবে নোট করুন, আপনি বিষয়বস্তু হিসাবে এলোমেলো এইচটিএমএল গণনা করতে না চাইলে আপনি .text () ব্যবহার করতে পারেন।
দুর্বৃত্তরা

@ আরোগলিএডার স্মার্ট, ব্যবহার সম্পর্কে চিন্তা করেনি .text()কারণ আপনার "খালি" ধারকটিতে আসলে কিছু মন্তব্য থাকতে পারে এবং না তেমন কার্যকর হবে trimনা :empty। থেক্স
জুরি

.html()যদি কোনও ধারকটির খুব দীর্ঘ এইচটিএমএল সামগ্রী থাকে তবে এটি কি কার্যকর সমাধান হতে পারে ?
techie_28

37

এটি খালি বলতে কী বোঝায় তা নির্ভর করে।

কোনও পাঠ্য নেই কিনা তা পরীক্ষা করতে (এটি শিশু উপাদানগুলি খালি খালি রাখার অনুমতি দেয়):

if ($('#leftmenu').text() == '')

কোনও শিশু উপাদান বা পাঠ্য নেই কিনা তা পরীক্ষা করতে:

if ($('#leftmenu').contents().length == 0)

অথবা,

if ($('#leftmenu').html() == '')

22

আপনি যদি খালি ডিভগুলি চেক করেন কীভাবে একটি দ্রুত ডেমো চান তবে আমি আপনাকে এই লিঙ্কটি ব্যবহার করার পরামর্শ দিচ্ছি:

http://html-tuts.com/check-if-html-element-is-empty-or-has-children-tags/


নীচে আপনার কয়েকটি সংক্ষিপ্ত উদাহরণ রয়েছে:

সিএসএস ব্যবহার করে

যদি আপনার ডিভি কিছু না খালি শ্বেত-স্থান ছাড়াও হয় তবে আপনি সিএসএস ব্যবহার করতে পারেন:

.someDiv:empty {
    display: none;
}

দুর্ভাগ্যক্রমে এমন কোনও সিএসএস নির্বাচনকারী নেই যা পূর্ববর্তী ভাইবোন উপাদানটি নির্বাচন করে। এখানে কেবল পরবর্তী ভাইবোন উপাদান রয়েছে:x ~ y

.someDiv:empty ~ .anotherDiv {
    display: none;
}

JQuery ব্যবহার করে

পাঠ্যের () ফাংশন সহ উপাদানটির পাঠ্য দৈর্ঘ্য পরীক্ষা করা হচ্ছে

if ( $('#leftmenu').text().length == 0 ) {
    // length of text is 0
}

উপাদানটির ভিতরে কোনও বাচ্চার ট্যাগ রয়েছে কিনা তা পরীক্ষা করুন

if ( $('#leftmenu').children().length == 0 ) {
    // div has no other tags inside it
}

খালি উপাদানগুলির যদি সাদা স্থান থাকে তবে তা পরীক্ষা করে দেখুন

if ( $.trim( $('.someDiv').text() ).length == 0 ) {
    // white-space trimmed, div is empty
}

12

আপনি এই জাতীয় jQuery কার্যকারিতা প্রসারিত করতে পারেন :

প্রসারিত করা :

(function($){
    jQuery.fn.checkEmpty = function() {
       return !$.trim(this.html()).length;
    };
}(jQuery));

ব্যবহার:

<div id="selector"></div>

if($("#selector").checkEmpty()){
     console.log("Empty");
}else{
     console.log("Not Empty");
}

3

এটা চেষ্টা কর:

$(document).ready(function() {
    if ($('#leftmenu').html() === "") {
        $('#menuTitleWrapper').remove();
        $('#middlemenu').css({'right' : '0', 'position' : 'absolute'});
        $('#PageContent').css({'top' : '30px', 'position' : 'relative'});
    }
});

এটি সবচেয়ে সুন্দর নয়, এটি কাজ করা উচিত। এটি অন্তর্নিহিত এইচটিএমএল (# বামমানের বিষয়বস্তু) খালি স্ট্রিং কিনা তা পরীক্ষা করে (যেমন এর অভ্যন্তরে কিছুই নেই)।


2

আমার ক্ষেত্রে ডকুমেন্টে প্রস্তুত হওয়ার জন্য আমার একাধিক উপাদান রয়েছে ready এটি এখন পর্যন্ত আমার জন্য কাজ করা ফাংশন (ফিল্টার):

$('[name="_invisibleIfEmpty"]').filter(function () {
    return $.trim($(this).html()).length == 0;
}).hide();

বা .mide () পরিবর্তে। (লুকান), আপনি যা পছন্দ করেন না কেন।

এফওয়াইআই: এটি, বিশেষত, সমাধানটি আমি শেয়ার পয়েন্টে বিরক্তিকর খালি টেবিল কোষগুলি আড়াল করতে ব্যবহার করছি (এই শর্ত "" || this (এটি)। শিশুদের ("মেনু") দৈর্ঘ্য "এর সাথে যুক্ত করুন।



1

আমি আজ এটির মুখোমুখি হয়েছি এবং গৃহীত উত্তরগুলি আমার পক্ষে কার্যকর হয়নি। এখানে আমি এটি কীভাবে করেছি।

if( $('#div-id *').length === 0 ) {
    // your code here...
}

আমার সমাধানটি ডিভের অভ্যন্তরে কোনও উপাদান রয়েছে কিনা তা পরীক্ষা করে তাই এটির ভিতরে কেবল পাঠ্য থাকলে এটি ডিভটি খালি চিহ্নিত করে।


1

এছাড়াও আপনি এটি ব্যবহার করতে পারেন:


    if (! $('#leftmenu').children().length > 0 ) {
         // do something : e.x : remove a specific div
    }

আমি মনে করি এটি আপনার পক্ষে কাজ করবে!


আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.