开发杂记-无心整理

by kevin 15. 六月 2014 17:32 >
最近是累了点,懒了点。 一个div元素,点击,页面外的元素,隐藏此div。 1: $(document).mouseup(function (e) 2: { 3: var container = $("YOUR CONTAINER SELECTOR"); 4:  5: if (!container.is(e.target) // if the target of the click isn't the container... 6: && container.has(e.target).length === 0) // ... nor a descendant of the container 7: { 8: container.hide(); 9: } 10: }); jquery.bxslider 是一个很不错的插件。 目前的版本是4+,使用过程中,碰到了几个bug. 如果刚好slider正在切换[gotoprev,gotonext]的时候,进行重绘[redraw],会造成slider停止工作。修复代码如下: 修改前: 1: el.redrawSlider = function () { 2: // resize all children in ratio to new screen size 3: slider.children.add(el.find('.bx-clone')).width(getSlideWidth()); 4: // adjust the height 5: slider.viewport.css('height', getViewportHeight()); 6: // update the slide position 7: if (!slider.settings.ticker) setSlidePosition(); 8: // if active.last was true before the screen resize, we want 9: // to keep it last no matter what screen size we end on 10: if (slider.active.last) slider.active.index = getPagerQty() - 1; 11: // if the active index (page) no longer exists due to the resize, simply set the index as last 12: if (slider.active.index >= getPagerQty()) slider.active.last = true; 13: // if a pager is being displayed and a custom pager is not being used, update it 14: if (slider.settings.pager && !slider.settings.pagerCustom) { 15: populatePager(); 16: updatePagerActive(slider.active.index); 17: } 18: } 修改后: 1: el.redrawSlider = function () { 2: if (slider.working) { 3: // Wait 'speed' amount of time before redrawing 4: setTimeout(function () { el.doRedrawSlider(); }, slider.settings.speed); 5: } else { 6: // Redraw immediately 7: el.doRedrawSlider(); 8: } 9: }; 10:  11: el.doRedrawSlider = function() { 12: // resize all children in ratio to new screen size 13: slider.children.add(el.find('.bx-clone')).width(getSlideWidth()); 14: // adjust the height 15: slider.viewport.css('height', getViewportHeight()); 16: // update the slide position 17: if (!slider.settings.ticker) setSlidePosition(); 18: // if active.last was true before the screen resize, we want 19: // to keep it last no matter what screen size we end on 20: if (slider.active.last) slider.active.index = getPagerQty() - 1; 21: // if the active index (page) no longer exists due to the resize, simply set the index as last 22: if (slider.active.index >= getPagerQty()) slider.active.last = true; 23: // if a pager is being displayed and a custom pager is not being used, update it 24: if (slider.settings.pager && !slider.settings.pagerCustom) { 25: populatePager(); 26: updatePagerActive(slider.active.index); 27: } 28: };   slider元素中,如果有img或者iframe无法正常加载,会引发slider无法正常工作。 修复前: 1: var loadElements = function (selector, callback) { 2: var total = selector.find('img, iframe').length; 3: if (total == 0) { 4: callback(); 5: return; 6: } 7: var count = 0; 8: selector.find('img, iframe').each(function () { 9: $(this).one('load', function () { 10: if (++count == total) callback(); 11: }).each(function () { 12: if (this.complete) $(this).load(); 13: }); 14: }); 15: } 修复后: 1: var loadElements = function (selector, callback) { 2: var total = selector.find('img, iframe').length; 3: if (total == 0) { 4: callback(); 5: return; 6: } 7: var count = 0; 8: selector.find('img, iframe').each(function () { 9: $(this).one('load', function () { 10: if (++count == total) callback(); 11: }).one('error', function() { 12: if (++count == total) callback(); 13: }).each(function () { 14: if (this.complete) $(this).load(); 15: }); 16: }); 17: }

开发杂记:jquery事件绑定

by kevin 27. 四月 2013 10:38 >
几对绑定事件和解绑的方法: live和die bind和unbind delegate和undelegate 他们的差别 英文版: http://www.alfajango.com/blog/the-difference-between-jquerys-bind-live-and-delegate/ 中文版: http://kb.cnblogs.com/page/94469/ 重要的是他们是一一对应的,不要搞混。 就是用bind绑定,就用unbind解除,不要用die和undelegate。