Tengo una tabla que quiero ocultar o mostrar con solo hacer clic en un botón. Además, cuando se hace clic en el botón, su texto debe cambiarse adecuadamente. Tengo el siguiente código, pero el texto del botón no se cambia:
<script> $(document).ready(function () { $("#myButton").click(function () { $(".myTable").toggle(1000, "linear", function changeButtonText() { $("#myButton").text = ($("#myButton").text === "Hide table" ? "Show table" : "Hide table"); }); }); }); </script> ... <input type="button" id="myButton" value="Hide table" /> <table class="myTable"> ... </table>No usaste la función de la manera correcta:
Si el elemento es botón :
Error:
$("#myButton").text = ("new text");Trabajar:
$("#myButton").text("new text");Ejemplo de trabajo:
$("#myButton").text("New text"); <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <button type="button" id="myButton">Old text</button>Si el elemento es input type="button" :
Error:
$("#myButton").text = ("new text");Trabajar:
$("#myButton").val("new text");Ejemplo de trabajo:
$("#myButton").val("New text"); <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="button" id="myButton" value="Hide table" />Prueba esto:
$("#myButton").val($("#myButton").val() === "Hide table" ? "Show table" : "Hide table");use esto para cambiar el texto de su botón
$("#myButton").attr('value', 'newText');