Dodaj atrybut wyłączony do elementu wejściowego za pomocą Javascriptu

Question

Mam pole wejściowe i chcę, aby go wyłączyć, a jednocześnie ukryć, aby uniknąć problemów podczas przenoszenia mojego formularza.

tej pory mam następujący kod do ukrycia moje wejście:

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

jest to wejście, które zostaje ukryty w wyniku:

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

Jak mogę też dodać atrybut disabled do wejście?

Answer 1

$("input").attr("disabled", true); od ... Nie wiem więcej.

Jest grudzień 2013 i naprawdę nie mam pojęcia, co powiedzieć.

Najpierw zawsze było .attr(), to zawsze było .prop(), więc wróciłem tutaj zaktualizowałem odpowiedź i uczyniłem ją dokładniejszą.

Potem rok później jQuery ponownie zmieniło zdanie i nie chcę nawet tego śledzić.

Krótka historia, od tej chwili jest to najlepsza odpowiedź: "możesz użyć obu ... ale to zależy."

Należy przeczytać tę odpowiedź Zamiast: https://stackoverflow.com/a/5876747/257493

A ich Uwagi do wydania tej zmiany są zawarte tutaj:

Ani .attr() ani .prop() powinny być wykorzystywane do pobierania/ustawiania wartość. Zamiast tego użyj metody .val() (chociaż użycie .attr ("value", "somevalue") będzie działało, tak jak przed 1.6).

Streszczenie korzystnego użycia

Sposób .prop() powinny być stosowane dla operacji atrybutów/właściwości i właściwości, które nie istnieją w HTML (takie jak window.location). Wszystkie pozostałe atrybuty (widoczne w html) mogą i powinny być modyfikowane przy użyciu metody .attr().

Lub innymi słowy:

"rzeczy .prop = non-dokument"

".attr" = rzeczy dokument

... ...

Obyśmy wszyscy dowiedzieli się tutaj o stabilności API ...

Answer 2

Wystarczy użyć jQuery attr() metoda

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

Answer 3

można uzyskać elementu DOM, i ustawić właściwość wyłączoną bezpośrednio.

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

lub jeśli jest więcej niż jeden, można użyć each() ustawić wszystkie z nich:

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

Answer 4

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

Wszystkie powyższe rozwiązania są całkowicie poprawny. Wybierz ten, który najlepiej pasuje do Twoich potrzeb.

Answer 5

Jeśli używasz jQuery, istnieje kilka różnych sposobów ustawiania wyłączonego atrybutu.

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); 

Answer 6

Praca kod z moich źródeł:

HTML WORLD

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

---

JS WORLD

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

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



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