javascript - 每次点击时隐藏和显示按钮

Question

我有 2 个按钮。在一种情况下，第一个按钮是“禁用”，在另一种情况下是“启用”，但在一个按钮中没有显示，样式为 display: none。

我在第一种情况下使用 jQuery。我单击启用按钮并显示禁用按钮。下次禁用按钮隐藏并在按钮启用时显示。

该脚本无法正常工作，因为它在每种情况下只工作一次并最终停止。

我有测试链接:https://jsfiddle.net/onfynvfk/5/

脚本是这样的:

jQuery(document).ready(function() {
    jQuery(".but_1").click(function() {
        jQuery(".but_1").hide("2"); 
        jQuery(".but_2").show("1").delay(1, function() {    
            jQuery(".but_2").hide("2");  
        });
        jQuery(".but_2").hide("2");     
        jQuery(".but_1").show("2");  
    });
});

这些按钮:

<input name="enviar" type="submit" disabled="disabled" id="c_input_submit" class="but_2" style="display:none;" value="Send Hide" />
<input name="enviar" type="submit" id="c_input_submit" class="but_1" value="Send Normal" />

感谢您的帮助。

Answer 1

这符合您正在寻找的内容吗？

https://jsfiddle.net/1zv3ty0u/

$(document).ready(function() {

    $(".but_1").click(function() {

        $(".but_1").hide(); 
        $(".but_2").show();
    });

    $(".but_2").click(function(){
        $(".but_2").hide();
        $(".but_1").show();
    });
});

和 html:

<input name="enviar" type="submit" id="c_input_submit" class="but_2 
style="display:none;" value="Send Hide" />

<input name="enviar" type="submit" id="c_input_submit" 
class="but_1" value="Send Normal" />

顺便说一下，$() 等于 jQuery()，前者通常用于提高代码可读性。