jQuery: আমি কি অ্যাডক্লাস () এবং এর মধ্যে বিলম্ব () বলতে পারি?


178

এর মতো সাধারণ কিছু:

$("#div").addClass("error").delay(1000).removeClass("error");

কাজ মনে হচ্ছে না। সবচেয়ে সহজ বিকল্প কি হবে?


10
ঠিক একই জিনিস করতে চেয়েছিলেন। কল করা ভাল লাগবে$("#div").addClassTemporarily("error",1000)
সেবাস্তিয়ান লরবার

উত্তর:


365

ক্লাসটি অপসারণ করতে আপনি একটি নতুন সারি আইটেম তৈরি করতে পারেন:

$("#div").addClass("error").delay(1000).queue(function(next){
    $(this).removeClass("error");
    next();
});

বা ডীকু পদ্ধতি ব্যবহার করে :

$("#div").addClass("error").delay(1000).queue(function(){
    $(this).removeClass("error").dequeue();
});

আপনাকে যে কারণে কল করতে হবে nextবা dequeuejQuery কে তা জানাতে হবে যে আপনি এই সারিবদ্ধ আইটেমটি দিয়ে এসেছেন এবং এটি পরের দিকে যেতে হবে।


3
আমি এই বিকল্পটি পছন্দ করি কারণ এটি সারিবদ্ধ ফাংশনে ব্যবহৃত jquery অবজেক্ট thats এর একটি রেফারেন্স পাস করা সহজ করে তোলে তাই এটি আরও সাধারণ প্রসঙ্গে (হার্ড কোডিং নাম ছাড়াই) ব্যবহার করা যেতে পারে।
গ্র্যান্ডমাস্টারবি

5
আমাদের "পরের" দরকার কেন? আমরা কি $ ("# ডিভ") করতে পারি add .ডক্লাস ("ত্রুটি") delay আরও মার্জিত বলে মনে হচ্ছে?
ভেনসোহ

@ ভেনসোহ আপনার একটি 'পরবর্তী' সারি আইটেম পাস করার দরকার নেই। পরিবর্তে আপনি ডিক্যু
gfullam

49

AFAIK বিলম্ব পদ্ধতিটি কেবল সংখ্যার সিএসএস পরিবর্তনের জন্য কাজ করে।

অন্যান্য উদ্দেশ্যে জাভাস্ক্রিপ্ট একটি সেটটাইমআউট পদ্ধতি নিয়ে আসে:

window.setTimeout(function(){$("#div").removeClass("error");}, 1000);

11
+1: জ্যাকুরির জন্য জ্যাকারি ব্যবহার করবেন না। অনেক সমস্যার সরল জাভাস্ক্রিপ্ট সমাধান রয়েছে।
জোয়েল

1
+1: প্রথম মন্তব্যের মতোই। সাধারণ জেএস কিছু সময় সূক্ষ্ম কাজ করে।
ওয়াওপ্যাট্রিক

1
সরলতার জন্য +1, তবে এটি গ্রহণযোগ্য উত্তরও +1 করেছে - কারণ এটি আমাকে দেখিয়েছে যে .queue () আসলে ধারাবাহিক বস্তুটি পাস করে যা ম্যানুয়ালি ('পরবর্তী') 'বলে ডাকা উচিত। আমি আধ ঘন্টা অবাক করে ভেবেছিলাম কেন আমার প্যারামিটারলেস কলব্যাকের শৃঙ্খলা কেবল প্রথমটি কার্যকর করে - অন্যান্য সাইটের অনেক উদাহরণ চেইনে একক দেরি এবং একটি প্যারামিটারলেস কলব্যাক ব্যবহার করে, যা সেই প্রক্রিয়াটির কিছুটা বিভ্রান্তিকর
ওভারসিপ্লিমেশন

1
কেবলমাত্র পেন্টেন্ট নোট: সেটটাইমআউট ব্রাউজারের উইন্ডো অবজেক্ট (বিওএম) থেকে আসে। জাভাস্ক্রিপ্ট (ইসিএমএ স্ক্রিপ্ট হিসাবে বোঝা) এর সেই পদ্ধতি নেই।
করবাচো

9

আমি জানি এটি একটি খুব পুরানো পোস্ট তবে আমি কয়েকটি উত্তর উত্তরকে এক jQuery মোড়ক ফাংশনে সংযুক্ত করেছি যা শৃঙ্খলা সমর্থন করে। আশা করি এটি কারও উপকারে:

$.fn.queueAddClass = function(className) {
    this.queue('fx', function(next) {
        $(this).addClass(className);
        next();
    });
    return this;
};

এবং এখানে একটি অপসারণ ক্লাসের মোড়ক দেওয়া আছে:

$.fn.queueRemoveClass = function(className) {
    this.queue('fx', function(next) {
        $(this).removeClass(className);
        next();
    });
    return this;
};

এখন আপনি এই জাতীয় জিনিসগুলি করতে পারেন - 1 .errorসেকেন্ড অপেক্ষা করুন , 3 সিসি অপেক্ষা করুন , অপেক্ষা করুন, সরান .error:

$('#div').delay(1000).queueAddClass('error').delay(2000).queueRemoveClass('error');


খুব উপকারী! ধন্যবাদ!
ফ্যাবিয়ান জেগার

6

jQuery এর সিএসএস ম্যানিপুলেশনটি সারিবদ্ধ নয়, তবে আপনি এটি করে 'এফএক্স' সারির মধ্যে এটি সম্পাদন করতে পারেন:

$('#div').delay(1000).queue('fx', function() { $(this).removeClass('error'); });

সেটটাইমআউটকে কল করার মতো একই জিনিস তবে পরিবর্তে jQuery এর সারি মেকানিজম ব্যবহার করে।


এটি আমার পক্ষে আরও উত্তমরূপে গৃহীত উত্তরের জন্য কাজ করে (শ্রেণিতে কোনও রূপান্তর রূপান্তর থাকলে কলগুলি পুনরাবৃত্তি করে না)।
ভাতওয়ালে

4

অবশ্যই আপনি যদি jQuery এর প্রসারিত করেন তবে এটি আরও সহজ হবে:

$.fn.addClassDelay = function(className,delay) {
    var $addClassDelayElement = $(this), $addClassName = className;
    $addClassDelayElement.addClass($addClassName);
    setTimeout(function(){
        $addClassDelayElement.removeClass($addClassName);
    },delay);
};

এর পরে আপনি এই ফাংশনটি অ্যাডক্লাসের মতো ব্যবহার করতে পারেন:

$('div').addClassDelay('clicked',1000);

1
এবং যদি আপনি চেইন সমর্থন যোগ করতে চান, প্লাগইন তৈরি সম্পর্কে return this
বেসিকগুলি পড়ুন

2

বিলম্ব একটি কাতারে কাজ করে। এবং যতদূর আমি জানি সিএসএস ম্যানিপুলেশন (অ্যানিমেটেড ব্যতীত) সজ্জিত নয়।


2

delayকোনও কিউ ফাংশনে কাজ করে না, তাই আমাদের ব্যবহার করা উচিত setTimeout()

এবং আপনার জিনিস আলাদা করার দরকার নেই। আপনাকে যা করতে হবে তা হ'ল একটি setTimeOutপদ্ধতিতে সমস্ত কিছু অন্তর্ভুক্ত করা :

setTimeout(function () {
    $("#div").addClass("error").delay(1000).removeClass("error");
}, 1000);

আপনাকে সেটটাইমআউট () সহ দেরি () ব্যবহার করতে হবে না।
ম্যাটয়াও

@ ম্যাটয়্যাও আমার ধারণা হয় না আপনি ধারণাটি পেয়ে গেছেন। আপনি যদি সেটটাইমআউট ব্যবহার না করেন, তবে সেই বিলম্বটি কাজ করবে না
অ্যালেক্স জোলিগ

1
সমাধানের জন্য একসাথে কাজ করার জন্য উভয়েরই দরকার নেই। হয় jQuery- এ সারি () সহ বিলম্ব () ব্যবহার করুন বা কেবল সেটটাইমআউট () ব্যবহার করুন সমস্যার সমাধান করতে পারেন। আমি আপনার উত্তর ভুল বলছি না।
ম্যাটয়াও


0

এই সহজ তীর ফান্ট চেষ্টা করুন:

setTimeout( () => { $("#div").addClass("error") }, 900 );

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