Usar un botón HTML para llamar a una función de JavaScript

Solución:

Hay algunas formas de manejar eventos con HTML / DOM. No existe una forma correcta o incorrecta, pero diferentes formas son útiles en diferentes situaciones.

1: Hay una definición en el HTML:

<input id="clickMe" type="button" value="clickme" onclick="doFunction();" />

2: Se agrega a la propiedad DOM para el evento en Javascript:

//- Using a function pointer:
document.getElementById("clickMe").onclick = doFunction;

//- Using an anonymous function:
document.getElementById("clickMe").onclick = function () { alert('hello!'); };

3: Y se adjunta una función al controlador de eventos usando Javascript:

var el = document.getElementById("clickMe");
if (el.addEventListener)
    el.addEventListener("click", doFunction, false);
else if (el.attachEvent)
    el.attachEvent('onclick', doFunction);

Tanto el segundo como el tercer método permiten funciones en línea / anónimas y ambos deben declararse después de que el elemento se haya analizado del documento. El primer método no es XHTML válido porque el atributo onclick no está en la especificación XHTML.

Los métodos primero y segundo son mutuamente excluyentes, lo que significa que el uso de uno (el segundo) anulará al otro (el primero). El tercer método le permitirá adjuntar tantas funciones como desee al mismo controlador de eventos, incluso si también se ha utilizado el primer o el segundo método.

Lo más probable es que el problema se encuentre en algún lugar de su CapacityChart() función. Después de visitar su enlace y ejecutar su secuencia de comandos, se ejecuta la función CapacityChart () y se abren las dos ventanas emergentes (una se cierra según la secuencia de comandos). Donde tienes la siguiente línea:

CapacityWindow.document.write(s);

En su lugar, intente lo siguiente:

CapacityWindow.document.open("text/html");
CapacityWindow.document.write(s);
CapacityWindow.document.close();

EDITAR

Cuando vi su código, pensé que lo estaba escribiendo específicamente para IE. Como han mencionado otros, deberá reemplazar las referencias a document.all con document.getElementById. Sin embargo, aún tendrá la tarea de corregir el script después de esto, por lo que recomendaría hacerlo funcionar al menos en IE primero, ya que cualquier error que cometa al cambiar el código para que funcione en varios navegadores podría causar aún más confusión. Una vez que esté funcionando en IE, será más fácil saber si está funcionando en otros navegadores mientras actualiza el código.

Yo diría que sería mejor agregar el javascript de una manera no intrusiva …

si usa jQuery, podría hacer algo como:

<script>
  $(document).ready(function(){
    $('#MyButton').click(function(){
       CapacityChart();
    });
  });
</script>

<input type="button" value="Capacity Chart" id="MyButton" >

Su HTML y la forma en que llama a la función desde el botón se ven correctos.

El problema parece estar en el CapacityCount función. Recibo este error en mi consola en Firefox 3.5: “document.all no está definido” en la línea 759 de bendelcorp.js.

Editar:

Parece document.all es una cosa solo de IE y es una forma no estándar de acceder al DOM. Si utiliza document.getElementById(), probablemente debería funcionar. Ejemplo: document.getElementById("RUnits").value en lugar de document.all.Capacity.RUnits.value

---

---

Utiliza Nuestro Buscador