分类： Javascript

修改Google搜索结果高亮显示效果

最近不知道什么原因，登陆Google账号后，搜索结果显示全部为蓝色加粗，再也看不到红色结果了，退出登录后清空cookie，搜索结果关键词红色高亮恢复。网上也有一些其他人遇到这种情况，但是没有好的解决办法，总不能一直不登陆Google吧。

网上有一种解决方案，使用Tampermonkey来修改页面CSS，Chrome下面可以使用，Firefox应该有类似的解决方案。

新建脚本：

// @match      https://*.google.com/*  
// ==/UserScript==  
var head, style;  
head = document.getElementsByTagName('head')[0];  
if (!head) { return; }  
style = document.createElement('style');  
style.type = 'text/css';  
style.innerHTML = 'em{color: #dd4b39;font-weight:normal;}';  
head.appendChild(style);

搜索关键词红色高亮又回来了！

ExtJs4使GridView里面的数据可以选择复制

ExtJs的GridView中，表格里显示出来的内容默认是无法选择和复制的，找了半天也没找到在哪儿可配。

网上有一种解决方案：

First, you will need to add the following CSS in your main stylesheet.

.x-grid-row ,.x-grid-cell, .x-unselectable, .x-unselectable * {
      -webkit-user-select: text !important;
    -o-user-select: text !important;
   -khtml-user-select: all !important;
   -ms-user-select: text !important;
   user-select: text !important;
   -moz-user-select: text !important;
  }
Next, just place the following code somewhere in the top of your application javascript file.
if(typeof Ext != 'undefined'){
    Ext.core.Element.prototype.unselectable = function(){returnthis;};
    Ext.view.TableChunker.metaRowTpl = [
     '<tr class="' + Ext.baseCSSPrefix + 'grid-row {addlSelector} {[this.embedRowCls()]}" {[this.embedRowAttr()]}>',
      '<tpl for="columns">',
       '<td class="{cls} ' + Ext.baseCSSPrefix + 'grid-cell ' + Ext.baseCSSPrefix + 'grid-cell-{columnId} {{id}-modified} {{id}-tdCls} {[this.firstOrLastCls(xindex, xcount)]}" {{id}-tdAttr}><div class="' + Ext.baseCSSPrefix + 'grid-cell-inner ' + Ext.baseCSSPrefix + 'unselectable" style="{{id}-style}; text-align: {align};">{{id}}</div></td>',
      '</tpl>',
     '</tr>'
    ];
   }

应该可行，不过没试过。

换了一种比较暴力的方式去实现，修改extJs的源码，找到unselectable这个function，注释掉

me.swallowEvent(“selectstart”, true);

修改ext的css文件， 找到.x-grid-cell-inner，添加如下几行：

user-select: text;  
-webkit-user-select: text;  
-o-user-select: text;  
-ie-user-select: text;  
-moz-user-select: text;  
-ie-user-select: text;

现在表格里面的内容就可以被复制了。

更正：

其实只要在GridPanel的配置项中，加入这个配置就可以了：

viewConfig:{  
   enableTextSelection:true  
}