জাভাস্ক্রিপ্ট ব্যবহার করে ইনপুট উপাদানটিতে অক্ষম বৈশিষ্ট্য যুক্ত করুন

Question

আমার একটি ইনপুট বাক্স রয়েছে এবং আমি চাই এটি অক্ষম হোক এবং একই সাথে আমার ফর্মটি পোর্ট করার সময় সমস্যাগুলি এড়াতে এটি আড়াল করুন।

আমার ইনপুটটি আড়াল করার জন্য এখনও পর্যন্ত আমার কাছে নিম্নলিখিত কোড রয়েছে:

$(".shownextrow").click(function() { 
    $(this).closest("tr").next().show().find('.longboxsmall').hide();
});

ফলস্বরূপ লুকিয়ে থাকা এই ইনপুটটি:

<input class="longboxsmall" type="text" />

কীভাবে আমি ইনপুটটিতে অক্ষম বৈশিষ্ট্য যুক্ত করতে পারি?

Answer 1

$("input").attr("disabled", true); হিসাবে ... আমি আর জানি না।

এটি ডিসেম্বর ২০১৩ এবং আমি আপনাকে কী বলব তা সম্পর্কে আসলেই আমার কোনও ধারণা নেই।

প্রথমে এটি সর্বদা ছিল .attr(), তারপরে এটি সর্বদা ছিল .prop(), তাই আমি এখানে ফিরে এসে উত্তরটি আপডেট করে এটিকে আরও নির্ভুল করে তুলেছি।

তারপরে এক বছর পরে jQuery আবার তাদের মন পরিবর্তন করেছে এবং আমি এটির উপর নজর রাখতে চাই না।

দীর্ঘ গল্প সংক্ষিপ্ত, এখনই, এটি সেরা উত্তর: "আপনি উভয় ব্যবহার করতে পারেন ... তবে এটি নির্ভর করে।"

পরিবর্তে আপনার এই উত্তরটি পড়া উচিত: https://stackoverflow.com/a/5876747/257493

এবং পরিবর্তনের জন্য তাদের প্রকাশের নোটগুলি এখানে অন্তর্ভুক্ত করা হয়েছে:

মান প্রাপ্ত / নির্ধারণের জন্য .attr () বা .prop () ব্যবহার করা উচিত নয়। পরিবর্তে .val () পদ্ধতিটি ব্যবহার করুন (যদিও .attr ("মান", "কিছু পরিমাণ" ব্যবহার করে) কাজ চালিয়ে যাবে, যেমন এটি 1.6 এর আগে করেছিল)।

পছন্দসই ব্যবহারের সংক্ষিপ্তসার

.Prop () পদ্ধতিটি বুলিয়ান বৈশিষ্ট্য / বৈশিষ্ট্যগুলির জন্য এবং এইচটিএমএল (যেমন উইন্ডো.লোকেশন) তে বিদ্যমান নেই এমন বৈশিষ্ট্যের জন্য ব্যবহার করা উচিত। অন্যান্য সমস্ত বৈশিষ্ট্য (আপনি এইচটিএমএল এ দেখতে পারেন) .attr () পদ্ধতিতে চালিত হতে এবং চালিয়ে যাওয়া উচিত।

বা অন্য কথায়:

".প্রপ = নথিবিহীন স্টাফ"

".attr" = ডকুমেন্ট স্টাফ

... ...

আমরা সবাই এপিআই স্থিতিশীলতা সম্পর্কে একটি পাঠ শিখি ...

Comments

আমার দৃষ্টি আকর্ষণ করার জন্য আপডেটের পাঠ্যটিকে যথেষ্ট বড় করার জন্য +1

— ভেল ভিক্টাস

পছন্দ করুন আমি এটি পোস্ট করার এক বছর পরে তারা আবার এটি পরিবর্তন করেছে বলে আমি দুঃখিত ... এবং আমি এই উত্তরটি ভুলে গিয়েছি। এই উত্তরটি পড়ুন: stackoverflow.com/a/5876747/257493

— ছদ্মবেশী

.Prop এবং .attr এর মধ্যে দস্তাবেজ / নথি নথিগত পার্থক্য অসীম সহায়ক এবং আমি প্রসঙ্গটি এর আগে এতটা সংক্ষিপ্ত আকারে তৈরি কখনও দেখিনি। অনেক প্রশংসিত!

— নিরবিচ্ছিন্নতা

Answer 2

আমার উত্স থেকে কার্যকরী কোড:

এইচটিএমএল ওয়ার্ল্ড

<select name="select_from" disabled>...</select>

---

জেএস বিশ্ব

var from = jQuery('select[name=select_from]');

//add disabled
from.attr('disabled', 'disabled');



//remove it
from.removeAttr("disabled");

Comments

গুগল থেকে সরাসরি এখানে আসা As of jQuery 1.6, the .attr() method returns undefined for attributes that have not been set. To retrieve and change DOM properties such as the checked, selected, or disabled state of form elements, use the .prop() method

— লোকগুলির

Answer 3

আপনি যদি jQuery ব্যবহার করেন তবে অক্ষম বৈশিষ্ট্য সেট করার কয়েকটি ভিন্ন উপায় রয়েছে।

var $element = $(...);
    $element.prop('disabled', true);
    $element.attr('disabled', true); 

    // The following do not require jQuery
    $element.get(0).disabled = true;
    $element.get(0).setAttribute('disabled', true);
    $element[0].disabled = true;
    $element[0].setAttribute('disabled', true);

Comments

কি হবে $element.eq(0)[0].disabled = true;? :

— পি

হ্যাঁ, এটি আমার পক্ষে উন্নত, আমি পারফরম্যান্সের উন্নতি করতে এতদূর যাই না।

— iConnor

+1 টি। যদিও এটি কিছুটা অনর্থক। আপনি যদি কোনও নোডলিস্ট / অ্যারের উপাদানগুলির সাথে ডিল করতে চলেছেন তবে সেগুলি সূচক অনুসারে সেগুলি পছন্দ করা বোকা। ইলেটেশন বা কেবলমাত্র আপনার প্রয়োজনীয় উপাদানগুলি নির্বাচন করা আরও বোধগম্য হয়।

Answer 4

$(element).prop('disabled', true); //true|disabled will work on all
$(element).attr('disabled', true); 
element.disabled = true;
element.setAttribute('disabled', true);

উপরের সমস্ত সঠিকভাবে বৈধ সমাধান। আপনার প্রয়োজনের সাথে সবচেয়ে ভাল ফিট করে এমন একটি চয়ন করুন।

Comments

এমন একটি সমাধান সরবরাহ করার জন্য আপনাকে ধন্যবাদ যা jQuery প্রয়োজন হয় না।

— ইলিয়াস জামারিয়া

Answer 5

আপনি ডোম উপাদানটি পেতে পারেন এবং অক্ষম সম্পত্তিটি সরাসরি সেট করতে পারেন।

$(".shownextrow").click(function() { 
  $(this).closest("tr").next().show()
          .find('.longboxsmall').hide()[0].disabled = 'disabled';
});

বা যদি একের বেশি থাকে তবে আপনি each()সেগুলি সেট করতে ব্যবহার করতে পারেন :

$(".shownextrow").click(function() { 
  $(this).closest("tr").next().show()
          .find('.longboxsmall').each(function() {
               this.style.display = 'none';
               this.disabled = 'disabled';
          });
});

Answer 6

শুধু jQuery এর attr()পদ্ধতি ব্যবহার করুন

$(this).closest("tr").next().show().find('.longboxsmall').attr('disabled', 'disabled');

Comments

এবং অক্ষম রাষ্ট্র ব্যবহার করে অপসারণ.removeAttr('disabled');

— রুহং

Answer 7

যেহেতু প্রশ্নটি জেএসের সাথে এটি করবেন তা জিজ্ঞাসা করছিলাম যে আমি একটি ভ্যানিলা জেএস বাস্তবায়ন সরবরাহ করছি।

var element = document.querySelector(".your-element-class-goes-here");
// it's a good idea to check whether the element exists
if (element != null && element != undefined) {
  element.disabled = "disabled";
}