前端常见的不常见问题

这篇博客总结了前端开发中的一些不常见问题及其解决办法,包括select2在模态层内的失效、IE8下placeholder的支持、jQuery与AngularJS事件冲突、IE8纯CSS实现圆角、AngularJS的watch使用、JSON与String转换、编码转换问题、Chrome的window.close()失效、AngularJS动态执行HTML代码、表格单元格长度平均分布、jQuery UI sortable拖动错位、IE浏览器DOM元素白线、Vue的:class与jQuery的addClass冲突、Echarts2.0以上版本的markLine tooltip问题和Echarts定时动画dispatchAction失效等。
摘要由CSDN通过智能技术生成

前端的随意笔记

标签(空格分隔): 前端不常见的问题 angularjs jquery


一、select2模态层内失效问题

$.fn.modal.Constructor.prototype.enforceFocus = function () { };

modal显示的时候必须让modal的enforceFocus方法制空(所谓的no-op否则的话会有个异常。)。然后隐藏的时候再还原。

二、IE8下placeholder失效

最简单粗暴的解决方式引用jquery-placeholder 或者 angular-placeholder.
主要是看当前框架使用的是什么了,基于angularjs最好是用angular-placeholder,可以直接将插件封装到自己的项目中作为指令使用,目前IE8对textarea支持不好。

三、jquery事件和angularjs结合使用莫名其妙报错

这种问题比较常见了,如果二者结合使用会莫名其妙报错纯属正常,不要慌。因为angular的事件机制和jquery的事件机制完全不同,会发生冲突,但是在angularjs里解决这个问题又很困难,往往jquery的一个模拟用户事件就能简单解决。这时候,你只要写一个简单的定时器就可以解决这个问题:

 $timeout(function () {
     angular.element('table thead tr th input[type="checkbox"]').click();
            }, 0, false);

四、IE8纯css实现圆角圆形

代码如下:

CSS代码:
.box {
    width: 150px; height: 150px;
    line-height: 150px;
    position: relative;
    overflow: hidden;
}
.radius {
    position: absolute;
    width: 100%; height: 100%;
    border-radius: 50%;
    border: 149px dotted;
    /* IE7,IE8圆尺寸要小1像素同时有1像素偏移 */
    margin: 0 0 1px 1px;
    border-width: 0vw;
    margin: 0vw;
    color: #cd0000;
    background-color: currentColor;
}
.text {
    position: relative;
    color: #fff;
    text-align: center;
    font-size: 24px;
}
HTML代码:
<div class="box">
    <i class="radius"></i>
    <p class="text">圆形</p>
</div>

当然,最简单粗暴的方式就是直接background-image,可参考

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值