Html5+JQuery页面标签的禁用问题

前言

在做移动应用项目时遇到的问题,完成某些操作后返回到前面页面要保证前面页面的标签内容不可被编辑,修改。有如下方法:

方法

  1. 对于input,select框,设置disabled=’disabled’。

    如:

    1
    2
    $('#testid1 input').attr('disabled','disabled');
    $('#testid2 select').attr('disabled','disabled');
  2. 对于一些点击触发事件的button,可以用unbind()移除事件方法。

    如:

    1
    $(".testclass3").unbind();

    注:在某些情况下unbind慎用,如页面初始化时调用click事件加载其他事件属性,unbind()可能会导致初始化时无法加载。

  3. 插件禁用,有些页面可能使用某些插件,对于插件的禁用,可以设置插件的事件方法return false;

    如:

    1
    2
    3
    $("#test #test4").on("touchmove",function(){
    return false;
    });

    这个是我们项目一个滑动插件触摸禁用的例子。

  4. 对于一些比较特殊的,如li标签,可以使用class样式进行处理。

    这是一个两个li标签切换禁用的例子。

    例:

    1
    2
    3
    4
    $("#test_li").addClass('disabledTab');
    .disabledTab{
    pointer-events: none;//这样鼠标或触摸就无法选中li标签
    }



-------------文章结束啦 ~\(≧▽≦)/~ 感谢您的阅读-------------

您的支持就是我创作的动力!

欢迎关注我的其它发布渠道