Quiero desactivar el botón de enlace después de hacer clic en él & otro habilitar. alternar activar/desactivar entre los dos botones de enlace usando javascriptQuiero deshabilitar el botón de enlace después de hacer clic en él y habilitar otro. alternar habilitar/deshabilitar entre ambos botones de enlace utilizando javascript
<a id="a1" href="page1.aspx">One</a><a id="a2" href="page2.aspx">Two</a>
Puede acceder y configurar el "desactivado" atribuir la siguiente manera:
if(somebutton.disabled == true){
somebutton.disabled = false;
}
recomiendo el uso de un marco de JavaScript como jQuery.
No hay ningún atributo "deshabilitado" para los enlaces y esto no funciona. –
Agregar más específicamente el atributo "deshabilitado" a un enlace funcionará, pero solo para Internet Explorer. –
Simple, solo agregue listeners a los eventos onclick en ambos enlaces, que deshabiliten el enlace en cuestión y habiliten el otro.
Algo así como
document.getElementById('a1').onclick = function() {
document.getElementById('a1').disabled = true;
document.getElementById('a2').disabled = false;
};
document.getElementById('a2').onclick = function() {
document.getElementById('a2').disabled = true;
document.getElementById('a1').disabled = false;
};Por supuesto, si usted va a ir ampliando esta a varios botones a continuación, usted puede fácilmente abstracta de lo anterior a los métodos de registro, de enlace sobre matrices de botones, etc. (posiblemente los que implementar una clase particular en lugar de especificar explícitamente la matriz).
podemos hacerlo usando cualquier propiedad o css. – Yogini
Su pregunta puede tener cualquiera de las siguientes 3 posibles situaciones. Elija cualesquiera suites su problema.
Case1) Un problema en su pregunta es que, dado que son enlaces que apuntan a page1.aspx y page2.aspx, respectivamente, una vez que hace clic en un enlace, se carga una nueva página en el navegador. Entonces, el efecto que quieres lograr realmente no importa.
Caso 2) Si tiene ambos enlaces 'Uno' y 'Dos' en cada una de las páginas aspx, entonces también puede codificar la deshabilitación del enlace que apunta a sí mismo. (O bien, no tener el enlace en absoluto).
Caso 3) Si tiene un marco para mostrar los enlaces 'Uno', 'Dos' y tiene otro marco para cargar el contenido de ambos enlaces, entonces su pregunta tiene un significado que deshabilita el otro enlace. Aquí está el código para el mismo.
<html>
<a id="a1" href="javascript:void(0)" onclick="toggle(objA1,objA2,'page1.aspx')">One</a>
<a id="a2" href="javascript:void(0)" onclick="toggle(objA2,objA1,'page2.aspx')">Two</a>
<br><iframe id="ifrm" src=""></iframe>
<script>
var objA1 = document.getElementById('a1');
var objA2 = document.getElementById('a2');
// d=element to disable, e=element to enable
function toggle(d,e,link)
{
//if already disabled do nothing(don't follow url)
if(d.disabled) return;
//enable/disable
d.disabled = true;
d.style.cursor = 'default';
e.disabled = false;
e.style.cursor = 'hand';
//follow link
ifrm.src = link;
}
</script>
</html>
La forma más sencilla es ocultar el enlace en lugar de hacerlo discapacitados.
Puede utilizar este código para ocultar el enlace después de hacer clic en él.
Su código probado & funcionó perfecto para mí. :-)
<script type="text/javascript">
onclick = function() {
var chk= document.getElementById('myElementId');
chk.style.display="none";
};
</script>
<html>
<head>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<style type="text/css">
.submit{
padding:8px;
border:1px solid blue;
}
</style>
</head>
<body>
<h1>Disabled submit form button after clicked with jQuery</h1>
<form action="#">
<p>
I'm a form ~
</p>
<input type="submit" value="Submit"></input>
<button>Enable Submit Button</button>
</form>
<script type="text/javascript">
$('input:submit').click(function(){
$('p').text("Form submiting.....").addClass('submit');
$('input:submit').attr("disabled", true);
});
$('button').click(function(){
$('p').text("I'm a form ~").removeClass('submit');
$('input:submit').attr("disabled", false);
});
</script>
</body>
</html>
<script type="text/javascript">
function validateForm(formObj) {
if (formObj.username.value=='') {
alert('Please enter a username');
return false;
}
formObj.submitButton.disabled = true;
formObj.submitButton.value = 'Please Wait...';
return true;
}
</script>
<form name="frmTest" action="" method="post" onsubmit="return validateForm(this);">
Username: <input type="text" name="username" value="" /><br />
<input type="submit" name="submitButton" value="Submit" />
</form>
es un enlace, no un botón – stuartdotnet
Para desactivar un ENLACE en lugar de un botón, el único que se puede hacer aparte de ocultando que es configurar no ir a ninguna parte.
onclick="this.href='javascript: void(0)';"
@Yogini: Comience una línea con 4 espacios y se formateará como código. – some