按钮触发事件，改变按钮的字和值，并且禁用其他按钮

1.页面上的按钮

<button type="button" class="layui-btn layui-btn-radius layui-btn-danger" id="suspend" value="0">暂停服务</button>
<button type="button" class="layui-btn layui-btn-radius layui-btn-normal" id="repeatqueue">按钮1</button>
<button type="button" class="layui-btn layui-btn-radius" id="queue">按钮2</button>

 

2.js里写方法，方法逻辑是：

做一个判断，如果获取到val是0，就执行改变这个按钮的字样stop.text("取消暂停"); 并且把这个按钮的值改为1，$("#suspend").val("1");，同时触发事件，把其他按钮的class名字改为禁用按钮样式，反之一样。

 

 

 

 

$("#suspend").click(function(){
        var stop = $("#suspend");
        var StopCode = $("#suspend").val();
        
        
        var KsCode = $("[name=KsCode]").val();
        var ZtCode = $("[name=ZtCode]").val();
        var YsCode = $("[name=YsCode]").val();
        var data=JSON.stringify({"ZtCode":ZtCode,"YsCode":YsCode,"KsCode":KsCode,"StopCode":StopCode});
        alert(data);
        $.ajax({
            
            type:"GET",

            url:"接口?hisdata="+data,

            data:data,

            dataType:"json", 
            
            success:function(da){
                alert(da.callStatus);
                if(StopCode == "0"){
                    stop.text("取消暂停");
                    $("#suspend").val("1");
                    $("#queue").attr("class","layui-btn layui-btn-disabled layui-btn-radius");//修改按钮class的名称，就是修改样式
                    $("#repeatqueue").attr("class","layui-btn layui-btn-disabled layui-btn-radius");
                    $("#queue").attr("disabled","disabled");//禁用按钮
                    $("#repeatqueue").attr("disabled","disabled");
                    }else if(StopCode == "1"){
                        stop.text("暂停服务");
                        $("#suspend").val("0");
                        $("#queue").attr("class","layui-btn layui-btn-radius");//修改按钮class的名称，换成原来的class
                        $("#repeatqueue").attr("class","layui-btn layui-btn-radius layui-btn-normal");
                        $("#queue").attr("disabled","");//启动按钮
                        $("#queue").removeAttr("disabled"); 
                        $("#repeatqueue").attr("disabled","");//启动按钮
                        $("#repeatqueue").removeAttr("disabled");
                    };
            },
            error:function(da){
                alert("请求失败");
            }
        })
        
        
    })
    })

启动按钮：$("#queue").attr("disabled","");

$("#queue").removeAttr("disabled"); 

这两个是一样的作用，但是不知道什么原因，使用其中一个不管用（可能是缓存的原因），我把两个都加上了，其实用一个就可以了。

 

本文是一个新手java写的，有很多地方都可以优化，请大家多多提意见！