วิธีการลบคุณลักษณะ "ปิดการใช้งาน" โดยใช้ jQuery?

ฉันต้องปิดการใช้งานอินพุตในตอนแรกจากนั้นคลิกลิงก์เพื่อเปิดใช้งาน

นี่คือสิ่งที่ฉันได้ลองมาแล้ว แต่มันไม่ได้ผล

HTML:

<input type="text" disabled="disabled" class="inputDisabled" value="">

jQuery:

$("#edit").click(function(event){
   event.preventDefault();
   $('.inputDisabled').removeAttr("disabled")
});

นี่แสดงให้ฉันtrueแล้วfalseแต่ไม่มีอะไรเปลี่ยนแปลงสำหรับอินพุต:

$("#edit").click(function(event){
   alert('');
   event.preventDefault();
   alert($('.inputDisabled').attr('disabled'));
   $('.inputDisabled').removeAttr("disabled");
   alert($('.inputDisabled').attr('disabled'));
});

มักจะใช้prop()วิธีการเปิดหรือปิดการใช้งานองค์ประกอบเมื่อใช้ jQuery (ดูด้านล่างสำหรับทำไม)

ในกรณีของคุณมันจะเป็น:

$("#edit").click(function(event){
   event.preventDefault();
   $('.inputDisabled').prop("disabled", false); // Element(s) are now enabled.
});

ตัวอย่าง jsFiddle ที่นี่

ทำไมต้องใช้prop()เมื่อคุณสามารถใช้attr()/ removeAttr()เพื่อทำสิ่งนี้?

โดยทั่วไปprop()ควรจะใช้เมื่อได้รับหรือการตั้งค่าคุณสมบัติ (เช่นautoplay, checked, disabledและrequiredหมู่คนอื่น ๆ )

โดยการใช้removeAttr()คุณจะลบdisabledแอตทริบิวต์ออกอย่างสมบูรณ์- ในขณะที่prop()เพียงตั้งค่าบูลีนพื้นฐานของคุณสมบัติเป็นเท็จ

ในขณะที่สิ่งที่คุณต้องการสามารถทำได้โดยใช้attr()/ removeAttr()ไม่ได้หมายความว่าควรจะทำ (และอาจทำให้เกิดพฤติกรรมที่แปลก / มีปัญหาเช่นในกรณีนี้)

สารสกัดต่อไปนี้ (นำมาจากเอกสาร jQuery สำหรับ prop () ) อธิบายจุดเหล่านี้โดยละเอียดยิ่งขึ้น:

"ความแตกต่างระหว่างคุณลักษณะและคุณสมบัติอาจมีความสำคัญในสถานการณ์ที่เฉพาะเจาะจงก่อน jQuery 1.6 .attr()บางครั้งวิธีนำค่าคุณสมบัติเข้ามาในบัญชีเมื่อดึงคุณสมบัติบางอย่างซึ่งอาจก่อให้เกิดพฤติกรรมที่ไม่สอดคล้องกันในขณะที่ jQuery 1.6 .prop() วิธีให้วิธีการดึงข้อมูลอย่างชัดเจน ค่าคุณสมบัติในขณะที่ .attr()ดึงคุณสมบัติ

"คุณสมบัติโดยทั่วไปส่งผลกระทบต่อสถานะไดนามิกขององค์ประกอบ DOM โดยไม่เปลี่ยนแอตทริบิวต์ HTML ที่เป็นอนุกรมตัวอย่างเช่นvalue คุณสมบัติขององค์ประกอบอินพุตdisabledคุณสมบัติของอินพุตและปุ่มหรือcheckedคุณสมบัติของช่องทำเครื่องหมาย.prop()วิธีควรใช้เพื่อตั้งค่าdisabledและcheckedแทนที่จะเป็น.attr() วิธี. .val()วิธีการที่ควรจะใช้สำหรับการรับและการตั้งค่า value."

<input type="text" disabled="disabled" class="inputDisabled" value="">
​<button id="edit">Edit</button>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

$("#edit").click(function(event){
    event.preventDefault();
    $('.inputDisabled').removeAttr("disabled")
});​

http://jsfiddle.net/ZwHfY/

เพื่อลบการใช้คุณสมบัติที่ถูกปิดใช้งาน

 $("#elementID").removeAttr('disabled');

และเพื่อเพิ่มการใช้คุณลักษณะที่ปิดใช้งาน

$("#elementID").prop("disabled", true);

สนุก :)

ใช้แบบนี้

HTML:

<input type="text" disabled="disabled" class="inputDisabled" value="">

<div id="edit">edit</div>

JS:

 $('#edit').click(function(){ // click to
            $('.inputDisabled').attr('disabled',false); // removing disabled in this class
 });

ฉันคิดว่าคุณกำลังพยายามที่จะสลับสถานะคนพิการในกรณีแม่มดคุณควรใช้ (จากคำถามนี้ ):

$(".inputDisabled").prop('disabled', function (_, val) { return ! val; });

นี่คือไวโอลินที่ใช้งานได้

คิดว่านี่คุณสามารถติดตั้งได้อย่างง่ายดาย

$(function(){
$("input[name^=radio_share]").click
(
    function()
    {
        if($(this).attr("id")=="radio_share_dependent")
        {
            $(".share_dependent_block input, .share_dependent_block select").prop("disabled",false);   
        }
        else
        {
            $(".share_dependent_block input, .share_dependent_block select").prop("disabled",true);   
        }
    }
 );
});

นี่เป็นรหัสเดียวที่ทำงานสำหรับฉัน:

element.removeProp('disabled')

โปรดทราบว่าคุณไม่removePropremoveAttr

ฉันใช้jQuery 2.1.3ที่นี่

2561 โดยไม่มี JQuery

ฉันรู้ว่าคำถามเกี่ยวกับ JQuery: คำตอบนี้เป็นเพียง FYI

document.getElementById('edit').addEventListener(event => {
    event.preventDefault();
    [...document.querySelectorAll('.inputDisabled')].map(e => e.disabled = false);
}); 

คำถามนี้กล่าวถึง jQuery โดยเฉพาะ แต่หากคุณต้องการทำสิ่งนี้ให้สำเร็จโดยปราศจาก jQuery สิ่งที่เทียบเท่าใน vanilla JavaScript คือ:

elem.removeAttribute('disabled');