Come posso disabilitare il campo di testo HTML usando questo semplice jQuery?

Ho questo semplice codice jQuery da testare.Come posso disabilitare il campo di testo HTML usando questo semplice jQuery?

<html> 
<head> 
<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("button").click(function(){ 
      $("text").attr("disabled",""); 
     }); 
    }); 
</script> 
</head> 
<body> 
<input type="text"> 
<br /> 
<button>Set the textfield disabled</button> 
</body> 
</html>

Fondamentalmente la pagina HTML viene fornita con un semplice pulsante e campo di testo. Tutto ciò che voglio è disabilitare il campo di input mentre faccio clic sul pulsante. Ma non funziona ???

(PS: questo codice proviene dal sito web w3schools.com, proprio per testare semplicemente come potente jQuery è).

fonte

2012-01-27 awongCM

Questo spiega perché W3School non è apprezzato qui. l'HTML non è valido. guarda l'elemento di testo ... – gdoron

@gdoron: Cosa c'è che non va con l'elemento ''? Non è chiuso correttamente? Non è valido in HTML5? '' Gli elementi 'non hanno mai contenuto, quindi non è ambiguo. – mpen

@ Mark. Guarda la mia risposta. Dovrebbe essere con chiusura automatica '' come ogni elemento XML. – gdoron

Da jQuery 1.7, è possibile utilizzare .prop:

$(document).ready(function(){ 
    $("button").click(function(){ 
     $(":text").prop("disabled", true); 
    }); 
});

Prima 1.7, si potrebbe fare:

$(document).ready(function(){ 
    $("button").click(function(){ 
     $(":text").attr("disabled", true); 
    }); 
});

PS: Usa $(":text") o $('input[type="text"]') per selezionare tutti gli elementi di tipo testo.

fonte

2012-01-27 07:20:56 xdazz

$ ('testo') non è un selettore valido! – devnull69

.attr funziona anche su jQuery 1.7+. – gabitzish

@ devnull69 Sì, hai ragione, non l'ho notato. – xdazz

$ ("input") attr ("disabile", "disabile");

fonte

2012-01-27 07:20:25 gabitzish

Ciò disabiliterà i pulsanti e ogni altro input che ha sulla pagina ... – gdoron

-1

"disabled" è una proprietà, non un attributo per-se. Booleans come "checked" o "disabled" non vengono sempre aggiornati (o recuperati) correttamente quando li accedono in quel modo. Utilizzare

$(':text').prop('disabled',true);

invece.

fonte

2012-01-27 07:20:59 mpen

$ ('testo') non è un selettore valido! – devnull69

@ devnull69: Il mio male. Pensavo che ci fosse qualcosa in contrario. ': text' è però. Aggiornato. Credo di aver capito che avrebbe controllato se il selettore corrispondesse a qualsiasi elemento. – mpen

o (più moderna):

$("input[type=text]").prop('disabled', true);

fonte

2012-01-27 07:22:21 devnull69

Prova questa:

<html> 
<head> 
<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){  
$("button").click(function(){   
$("#text").attr("disabled","true");  
}); 
}); 
</script> 
</head> 
<body> 
<input id="text" type="text"> 
<br /> 
<button>Set the textfield disabled</button> 
</body> 
</html>

fonte

2012-01-27 07:24:41

@ devnull69- L'ho controllato e funziona benissimo !!! –

@gdoron Tapas ha anche modificato l'HTML sotto – devnull69

@ devnull69. Ma l'ho nascosto con un rientro scadente ... =) – gdoron

Non c'è text selettore nella jquery. È necessario utilizzare il selettore di attributo [attribute=value]

$('input[type=text]').prop('disabled', true); // prop Works on jquery 1.7+

$('input[type=text]').attr('disabled', 'disabled'); // Works in each version. 
                // But isn't W3C standard.

c'è un selettore :text ma è meno efficiente quindi la prima opzione, vedere la docs:

$ (': text') equivale a $ ('[tipo = testo]') e quindi selezionare s tutti gli elementi. Come con altri selettori di pseudo-classe (quelli che iniziano con un ":") si consiglia di precederlo con un nome di tag o qualche altro selettore; in caso contrario, il selettore universale ("") è implicito. In altre parole, $ (': text') è equivalente a $ (': text'), quindi dovrebbe essere usato $ ('input: text').

Note aggiuntive: Perché : testo è un'estensione jQuery e non fa parte del specifica CSS, query utilizzando: il testo non può usufruire della l'incremento delle prestazioni fornite dal metodo nativo DOM querySelectorAll() . Per prestazioni migliori nei browser moderni, utilizza [type = "text"] .

Nota che il tuo XHTML non è valido. Dovresti chiudere lo <input type="text"> =><input type="text" />

fonte

2012-01-27 07:27:23 gdoron

Sì. Questo è probabilmente il motivo. – awongCM

@ AW-GWTF899. Quindi dovresti accettare la risposta ... ** =) ** – gdoron

Come posso disabilitare il campo di testo HTML usando questo semplice jQuery?

risposta

Problemi correlati