(html按钮禁用与启用)===(html按钮禁用与允许)

15 篇文章 0 订阅
10 篇文章 0 订阅

效果图

点击禁用(禁用颜色变成浅色)---变成允许(允许是颜色是深色)

 

点击允许(允许是颜色是浅色)---变成禁用(禁用颜色变成深色)

 

代码如下

 

<button type="button" class="btn btn-xs btn-danger dels z_btn_d" data-id="{$item['id']}">禁用</button>

<button type="button" class="btn btn-xs btn-info edit" data-id="{$item['id']}">允许</button>

 

 

  //  禁用

        $(document).on("click", '.dels',function(){

            var id=$(this).attr('data-id');

            $('#del_pp_by_id').attr('data-id',id);

            $(".edit").removeClass("colorss");

            $(".dels").addClass("colorss");

        })

  //允许

        $(document).on("click", '.edit',function(){

            var id=$(this).attr('data-id');

            $(".dels").removeClass("colorss");

            $('.edit').addClass("colorss");

        })

    .colorss{

        opacity: 0.3;

    }

 

 

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
要设置HTML按钮图层,可以按照以下步骤进行操作: 1. 在HTML文件中,使用`<button>`标签创建按钮元素。 2. 使用CSS样式表来设置按钮的属性,如颜色、大小、字体等。 3. 如果需要设置按钮的图层,可以使用CSS中的`position`属性来实现。例如,使用`position: absolute`来将按钮设置为绝对定位,然后使用`top`和`left`属性来调整按钮在页面中的位置。 4. 可以使用CSS中的`z-index`属性来控制按钮的图层顺序,确保它在其他元素之上显示。 下面是一个设置HTML按钮图层的示例代码: ``` <!DOCTYPE html> <html> <head> <title>Button Layering Example</title> <style> .button { background-color: #4CAF50; border: none; color: white; padding: 15px 32px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; margin: 4px 2px; cursor: pointer; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1; } .background { background-image: url('background.jpg'); background-repeat: no-repeat; background-size: cover; height: 100vh; width: 100vw; position: absolute; top: 0; left: 0; z-index: 0; } </style> </head> <body> <div class="background"></div> <button class="button">Click Me!</button> </body> </html> ``` 在这个示例中,我们创建了一个带有背景图片的`.background`元素,然后使用`z-index`属性将它置于按钮下方。按钮被绝对定位到页面中间,使用`transform`属性来水平和垂直居中。按钮的`z-index`属性被设置为1,确保它在背景图层之上显示。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

郝晨妤

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值