javascript - jquery点击、显示和隐藏功能

Question

请帮助我的代码片段..我有这段代码，但我不知道哪里出了问题..这是我的代码

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<form id="krishna">
    <input type="text" readonly value="krishna" ><br>
    <button id="next">Next</button>
</form>
<form id="radha">
    <input type="text" readonly value="radha" ><br>
    <button id="prev">Previous</button>
</form>
<script>
$(document).ready(function(e) {
    $("#radha").hide();

    $("#next").click(function() {
        $("#radha").show();
        $("#krishna").hide();
    });

    $("#prev").click(function() {
        $("#radha").hide();
        $("#krishna").show();
    });
});
</script>

当我点击下一步时，似乎没有转到下一个表格。谢谢大家。

Answer 1

这可能是因为您的表单缺少一些属性

HTML

<form id="krishna">
    <input type="text" readonly value="krishna" />
    <br />
    <button type='button' id="next">Next</button>
</form>
<form id="radha">
    <input type="text" readonly value="radha" />
        <br />
    <button type='button' id="prev">Previous</button>
</form>

脚本

$(document).ready(function () {
    $("#radha").hide();

    $("#next").click(function () {
        $("#radha").show();
        $("#krishna").hide();
    });

    $("#prev").click(function () {
        $("#radha").hide();
        $("#krishna").show();
    });
});

检查 here