চেকবক্সের লেবেলের জন্য jQuery নির্বাচনকারী

Question

<input type="checkbox" name="filter" id="comedyclubs"/>
<label for="comedyclubs">Comedy Clubs</label>

যদি আমার কাছে একটি লেবেল বর্ণিত একটি চেক বাক্স থাকে তবে আমি কীভাবে jQuery ব্যবহার করে লেবেলটি নির্বাচন করতে পারি? লেবেল ট্যাগটিকে একটি আইডি দেওয়া এবং এটি ব্যবহার করে নির্বাচন করা কি আরও সহজ হবে $(#labelId)?

Answer 1

এই কাজ করা উচিত:

$("label[for='comedyclubs']")

আরও দেখুন: নির্বাচক / গুণাবলী - jQuery জাভাস্ক্রিপ্ট লাইব্রেরি

Comments

ওয়েবকিট ব্রাউজারগুলির জন্য (সাফারি / ক্রোম), আপনি $('#comedyclubs')[0].labelsনির্ধারিত সমস্ত লেবেল অ্যাক্সেস করতে পারেন #comedyclubs।

— ম্যাট

অবজেক্টটিকে স্ট্রিংয়ে রূপান্তর করতে .text () ব্যবহার করুন: সতর্কতা ($ ("লেবেল [= 'কমেডি ক্লাবগুলির জন্য]]" "।) পাঠ্য ());

— Loren

কেবলমাত্র $ ("লেবেল [= 'কমেডি ক্লাবস]]" ") ব্যবহার করে আপনি মান পাবেন তবে এটি লেবেলটি ফাঁকা করে দেবে। সুতরাং, $ ("লেবেল [= 'কমেডি ক্লাবগুলির জন্য]]" ব্যবহার করুন) পাঠ্য ()

— শাহিল

Answer 2

$("label[for='"+$(this).attr("id")+"']");

এটি আপনাকে লুপের পাশাপাশি সমস্ত ক্ষেত্রের জন্য লেবেল নির্বাচন করতে দেয়। সমস্ত নিশ্চিত করতে আপনার লেবেলের বলা উচিত হয় for='FIELD'যেখানে FIELDক্ষেত্র, যার জন্য এই লেবেলের সংজ্ঞায়িত হচ্ছে ID।

Comments

যার একাধিক ক্ষেত্র রয়েছে তার পক্ষে এটি দুর্দান্ত উত্তর। এই উত্তরটি # 1 হওয়া উচিত।

Answer 3

এটি করা উচিত:

$("label[for=comedyclubs]")

আপনার আইডিতে যদি অক্ষর অক্ষর না থাকে তবে আপনাকে অবশ্যই উদ্ধৃতি সহ অ্যাট্রি মানটি ঘিরে ফেলতে হবে:

$("label[for='comedy-clubs']")

Comments

এই উত্তরটি যখন অগ্রণী হিসাবে একই মিনিটে জমা দেওয়া হয়েছিল তখন কীভাবে SO খ্যাতি চলে যায় তা অবাক করুন। :)

— স্ক্রিরাস

উদ্ধৃতি সহ

— অ্যাটর

Answer 4

আর একটি সমাধান হতে পারে:

$("#comedyclubs").next()

Comments

এটি সবচেয়ে স্থিতিশীল সমাধান নাও হতে পারে, কারণ চেকবাক্সের পরে লেবেলটি সর্বদা পরবর্তী আইটেম হওয়া দরকার। একটি গ্রাফিকাল নতুন নকশায় এই যুক্তি ভঙ্গ হতে পারে।

— কিপ

অধিকার! তবে এক্ষেত্রে সূক্ষ্মভাবে কাজ করে: ডি এবং লিটল আরও সুরক্ষিত সংস্করণের জন্য আমরা .next ('লেবেল'), বা .প্রিভ ('লেবেল') সংজ্ঞায়িত করতে পারি।

— ব্রিগন্তী

একটি সামান্য স্থিতিশীল উন্নতি হবে:$("#comedyclubs").nextAll().first()

— স্কিরিরাস

আপনার পদ্ধতির মত $ ()। পরবর্তী ()। পাঠ্য ()

— Rm558

Answer 5

ধন্যবাদ কিপ, যারা ফাংশনটির মধ্যে পুনরাবৃত্তি বা সংযুক্ত হয়ে $ (এটি) ব্যবহার করে একই অর্জন করতে চাইছেন তাদের জন্য:

$("label[for="+$(this).attr("id")+"]").addClass( "orienSel" );

আমি এই প্রকল্পটি কাজ করার সময় কিছুক্ষণের জন্য চেয়েছিলাম তবে একটি ভাল উদাহরণ খুঁজে পেলাম না তাই আমি আশা করি এটি একই সমস্যাটি সমাধান করতে চাইলে অন্যদের সহায়তা করে helps

উপরের উদাহরণে, আমার উদ্দেশ্য ছিল রেডিও ইনপুটগুলি লুকানো এবং একটি চটজলদি ব্যবহারকারীর অভিজ্ঞতা প্রদানের জন্য লেবেলগুলি স্টাইল করা (ফ্লোচার্টের অভিমুখীকরণ পরিবর্তন করা)।

আপনি এখানে একটি উদাহরণ দেখতে পারেন

আপনি যদি উদাহরণটি পছন্দ করেন তবে এখানে সিএসএস করুন:

.orientation {      position: absolute; top: -9999px;   left: -9999px;}
    .orienlabel{background:#1a97d4 url('http://www.ifreight.solutions/process.html/images/icons/flowChart.png') no-repeat 2px 5px; background-size: 40px auto;color:#fff; width:50px;height:50px;display:inline-block; border-radius:50%;color:transparent;cursor:pointer;}
    .orR{   background-position: 9px -57px;}
    .orT{   background-position: 2px -120px;}
    .orB{   background-position: 6px -177px;}

    .orienSel {background-color:#323232;}

এবং জাভাস্ক্রিপ্ট সম্পর্কিত অংশ:

function changeHandler() {
    $(".orienSel").removeClass( "orienSel" );
    if(this.checked) {
        $("label[for="+$(this).attr("id")+"]").addClass( "orienSel" );
    }
};

লেবেলটি ইনপুট অনুসরণ করে মূল প্রশ্নের মূল বিকল্পের মূল, আপনি একটি খাঁটি সিএসএস সমাধান নিয়ে যেতে পারেন এবং পুরোপুরি জাভাস্ক্রিপ্ট ব্যবহার করা এড়াতে পারেন ...:

input[type=checkbox]:checked+label {}