কীভাবে জাভাস্ক্রিপ্ট ব্যবহার করে এইচটিএমএল বোতামটি অক্ষম করবেন?

Question

আমি পড়েছি যে আপনি এইচটিএমএল বোতামটি কেবল disableতার ট্যাগে যুক্ত করে অক্ষম করতে (শারীরিকভাবে সঙ্কোচনযোগ্য করতে সক্ষম) করতে পারেন , তবে কোনও বৈশিষ্ট্য হিসাবে নয়, নীচে:

<input type="button" name=myButton value="disable" disabled>

যেহেতু এই সেটিংটি কোনও বৈশিষ্ট্য নয়, তাই জাভাস্ক্রিপ্টের মাধ্যমে আমি কীভাবে এটিকে আগে সক্রিয় করা একটি বোতাম অক্ষম করতে গতিতে যুক্ত করতে পারি?

Answer 1

যেহেতু এই সেটিংটি কোনও বৈশিষ্ট্য নয়

এটি একটি বৈশিষ্ট্য।

কিছু বৈশিষ্ট্যগুলি বুলিয়ান হিসাবে সংজ্ঞায়িত করা হয় যার অর্থ আপনি তাদের মান নির্দিষ্ট করতে পারেন এবং সমস্ত কিছু ছেড়ে যেতে পারেন। অর্থাত অক্ষম = " অক্ষম " পরিবর্তে আপনি কেবলমাত্র সাহসী অংশ অন্তর্ভুক্ত করেন। এইচটিএমএল 4-এ, আপনার কেবলমাত্র সাহসী অংশটি অন্তর্ভুক্ত করা উচিত কারণ সম্পূর্ণ সংস্করণটি সীমিত সহায়তার সাথে বৈশিষ্ট্য হিসাবে চিহ্নিত হয়েছে (যদিও এটি স্পপটি লেখা হয়েছিল তখন এটি এখন কম সত্য)।

এইচটিএমএল 5 হিসাবে, নিয়মগুলি পরিবর্তিত হয়েছে এবং এখন আপনি কেবল নামটি অন্তর্ভুক্ত করেন, মানটি নয়। এটি কোনও ব্যবহারিক পার্থক্য করে না কারণ নাম এবং মান একই।

করে DOM সম্পত্তি এছাড়াও বলা হয় disabledএবং একটি বুলিয়ান যে লাগে trueবা false।

foo.disabled = true;

তত্ত্ব আপনিও যে কোনো foo.setAttribute('disabled', 'disabled');এবং foo.removeAttribute("disabled"), কিন্তু আমি Internet Explorer এর পুরোনো সংস্করণগুলি (যা বগী কুখ্যাতিপূর্ণভাবে যখন এটা আসে সঙ্গে এই বিশ্বাস করবে না setAttribute)।

Comments

এটি উভয়ই করা, সম্পত্তি পরিবর্তন এবং বৈশিষ্ট্য নির্ধারণ করা কি বোধগম্য হবে বা এটি কেবল একটি ওভারকিল?

— v010dya

কি fooআছে foo.disabled = true;? এটা কি সেই বোতামটির আইডি?

— স্ট্যাক করুন

@ স্ট্যাক - আপনার পছন্দসই অর্থের মাধ্যমে সংগৃহীত উপাদানটির একটি রেফারেন্স সম্বলিত একটি পরিবর্তনশীল (যেমন ক্যোয়ারী নির্বাচনকারী)

— কোয়ান্টিন

Answer 2

অক্ষম করা

document.getElementById("btnPlaceOrder").disabled = true; 

সক্রিয় করতে

document.getElementById("btnPlaceOrder").disabled = false; 

Comments

কিছু কারণে এটি আমার পক্ষে কাজ করেছে যদিও $('#btnPlaceOrder').disabled = false;তা না করে।

— লেভিনিনজা

আমি $('#btnPlaceOrder')[0].disabled = falsejquery নির্বাচক হিসাবে ব্যবহৃত হিসাবে একটি অ্যারে ফেরত বলে মনে হচ্ছে। অসহায়তা।

— চিলি

jquery! == জাভাস্ক্রিপ্ট। jquery একটি অ্যারের মতো নির্বাচককে ফেরত দেয়।

— অনিলরেডশিফট

@ লেভিনিঞ্জ, চিলি - $ ('# বিটিএনপ্লেস অর্ডার')। প্রোপ ('অক্ষম', মিথ্যা);

— ডোমিনিক স্পুটে

Answer 3

এটি একটি বৈশিষ্ট্যযুক্ত, তবে একটি বুলিয়ান একটি (সুতরাং এটির কোনও নামের প্রয়োজন নেই, কেবল একটি মূল্য - আমি জানি, এটি অদ্ভুত)। আপনি জাভাস্ক্রিপ্টে সম্পত্তিটির সমতুল্য সেট করতে পারেন:

document.getElementsByName("myButton")[0].disabled = true;

Comments

এটির একটি মান দরকার, এটি এমন নাম যা এটির প্রয়োজন হয় না। (অদ্ভুত কিন্তু সত্য).

— কোয়ান্টিন

@ ডেভিড: আমার মনে আছে এটি পড়ার আগে, স্থির। এটি প্রকৃতপক্ষে অদ্ভুত এবং সম্ভবত সিনট্যাক্স হাইলাইটাররা এটি সঠিকভাবে সম্মানিত করলে আরও বোধগম্য হবে :-)

— অ্যান্ডি ই

Answer 4

নিম্নলিখিত চেষ্টা করুন:

document.getElementById("id").setAttribute("disabled", "disabled");

Comments

ডেভিড ডারওয়ার্ড যেমন উল্লেখ করেছেন , সঠিকভাবে ক্রস ব্রাউজারের উপর নির্ভর করা যায় না এবং পরিবর্তে সম্পত্তি সমতুল্য ব্যবহার করা উচিত।

— অ্যান্ডি ই

Answer 5

disabledকোনওটিতে বৈশিষ্ট্য নির্ধারণের আনুষ্ঠানিক উপায় HTMLInputElementহ'ল:

var input = document.querySelector('[name="myButton"]');
// Without querySelector API
// var input = document.getElementsByName('myButton').item(0);

// disable
input.setAttribute('disabled', true);
// enable
input.removeAttribute('disabled');

যদিও @ কাউসার এর উত্তর একটি সক্ষম এবং অক্ষম করার জন্য যথেষ্ট এবং আই এর historতিহাসিকভাবে বগিরHTMLInputElement কারণে ক্রস ব্রাউজারের সামঞ্জস্যের পক্ষে সম্ভবত পছন্দনীয় setAttribute, তবে এটি কেবলমাত্র Elementবৈশিষ্ট্যগুলির ছায়া Elementবৈশিষ্ট্যের কারণেই কাজ করে । যদি কোনও সম্পত্তি সেট করা থাকে, তবে ডিওএম সমতুল্য বৈশিষ্ট্যের মানের চেয়ে ডিফল্টরূপে সম্পত্তিটির মান ব্যবহার করে।

বৈশিষ্ট্য এবং গুণাবলী মধ্যে একটি খুব গুরুত্বপূর্ণ পার্থক্য আছে। একটি সত্য একটি উদাহরণ HTMLInputElement সম্পত্তি হল input.value, এবং নীচে প্রমান কিভাবে ছায়া কাজ:

var input = document.querySelector('#test');

// the attribute works as expected
console.log('old attribute:', input.getAttribute('value'));
// the property is equal to the attribute when the property is not explicitly set
console.log('old property:', input.value);

// change the input's value property
input.value = "My New Value";

// the attribute remains there because it still exists in the DOM markup
console.log('new attribute:', input.getAttribute('value'));
// but the property is equal to the set value due to the shadowing effect
console.log('new property:', input.value);

<input id="test" type="text" value="Hello World" />

বৈশিষ্ট্য ছায়া বৈশিষ্ট্য বলতে যা বোঝায় এটি। এই ধারণাটি prototypeচেইনের উত্তরাধিকারসূত্রে প্রাপ্ত বৈশিষ্ট্যের ক্ষেত্রেও প্রযোজ্য :

function Parent() {
  this.property = 'ParentInstance';
}

Parent.prototype.property = 'ParentPrototype';

// ES5 inheritance
Child.prototype = Object.create(Parent.prototype);
Child.prototype.constructor = Child;

function Child() {
  // ES5 super()
  Parent.call(this);

  this.property = 'ChildInstance';
}

Child.prototype.property = 'ChildPrototype';

logChain('new Parent()');

log('-------------------------------');
logChain('Object.create(Parent.prototype)');

log('-----------');
logChain('new Child()');

log('------------------------------');
logChain('Object.create(Child.prototype)');

// below is for demonstration purposes
// don't ever actually use document.write(), eval(), or access __proto__
function log(value) {
  document.write(`<pre>${value}</pre>`);
}

function logChain(code) {
  log(code);

  var object = eval(code);

  do {
    log(`${object.constructor.name} ${object instanceof object.constructor ? 'instance' : 'prototype'} property: ${JSON.stringify(object.property)}`);
    
    object = object.__proto__;
  } while (object !== null);
}

আমি আশা করি সম্পত্তি এবং বৈশিষ্ট্যের মধ্যে পার্থক্য সম্পর্কে এটি কোনও বিভ্রান্তিকে পরিষ্কার করে দেয়।

Answer 6

এটি এখনও একটি বৈশিষ্ট্য। এটি সেট করা হচ্ছে:

<input type="button" name=myButton value="disable" disabled="disabled">

... বৈধ.

Comments

বৈধ, তবে অনুমান অনুসারে

— কোয়ান্টিন

সমস্ত ব্রাউজারগুলি অক্ষম = "অক্ষম" সন্ধান করে, আমি এটিকে এড়াতে বলি অনুমানগুলি জানি, তবে অক্ষম = "অক্ষম" বা চেকড = "চেকড" বা নির্বাচিত = "নির্বাচিত" সেট করতে আমার কোনও সমস্যা হয়নি ... কেবল ডন ' t do অক্ষম = "সত্য" ... কেবলমাত্র কিছু ব্রাউজারই তা স্বীকার করবে

— বব ফিনচাইমার

স্পষ্টতই সমস্ত ব্রাউজার এটিকে সমর্থন করে না - যদি তা না করে তবে স্পেসটি এতটা স্পষ্ট হবে না। এগুলি আর সাধারণ ব্যবহারে নেই।

— কোয়ান্টিন

বিটিডাব্লু, প্রশ্নটি বলছে "আমি কীভাবে এটি জাভাস্ক্রিপ্টের মাধ্যমে গতিশীলভাবে যুক্ত করতে পারি"

— কোয়ান্টিন

নিশ্চিত তবে প্রশ্নটি অ্যাট্রিবিউট না হয়ে অক্ষম হওয়া সম্পর্কে কথা বলতে চলেছে। আমার উত্তরটি তা নিষ্পত্তির বিষয়ে এবং আপনি এটিকে একটি গুণ হিসাবে ব্যবহার করতে পারবেন বলে। আপনি DOM সম্পত্তি ব্যবহার করতে পারেন ।

— অলি

Answer 7

যদি আপনার কাছে বোতাম বোতামটি থাকে তবে: b.disabled=false;

Answer 8

আমি মনে করি সর্বোত্তম উপায় হতে পারে:

$("#ctl00_ContentPlaceHolder1_btnPlaceOrder").attr('disabled', true);

এটি সূক্ষ্ম ক্রস ব্রাউজারে কাজ করে।

Comments

এটা হওয়া উচিত prop, না attr।

— আন্তি হাপালা

প্রশ্ন দেশীয়

— জেএস

Answer 9

<button disabled=true>text here</button>

আপনি এখনও একটি বৈশিষ্ট্য ব্যবহার করতে পারেন। কেবলমাত্র 'মান' এর পরিবর্তে 'অক্ষম' বৈশিষ্ট্যটি ব্যবহার করুন।

Comments

এটা disabled="disabled"বা ঠিক disabled। কোন স্ট্রিং মান সমতূল্য "disabled"সহ, disabled="true"এবং disabled="false"।

— ব্যবহারকারী4642212