2012-03-02 6 views
0

私はドキュメントの選択を無効にした後に選択できるように、テーブルに入力の負荷がかかるという問題があります。私は恐ろしい青の選択範囲を望んでいない(私は自分の選択範囲をCSSを使用してmakignです)。だから私はそれを取り除きたい。しかし、特定の入力に対して有効にするには選択が必要です。問題は、文書の選択を無効にして、その文書が機能していない文書でインラインを再度有効にしてみることだけです。テーブルセルの選択を個別に無効にすると、セルがうまく選択できなくなります。なぜドキュメントを無効にした後、ドキュメント内の要素を再度有効にしますか?

UPDATE:これはIE専用です。私は基本的にすべてのハイライトを無効にするか、最悪の場合、テーブルのすべてのハイライトを無効にします。次に、特定のセルで強調表示を有効にしたい。私はスプレッドシートアプリケーションを作成しています。私は青がほしくない。私は強調表示されているものを制御したい。申し訳ありませんが、上記が明確でない場合。

誰かがあなたには、いくつかのブラウザのCSSでこれを行うことができます...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <title></title> 
     <link href="/Content/Fiddle.css" rel="stylesheet" type="text/css" /> 
     <link href="/Content/Site.css" rel="stylesheet" type="text/css" /> 
     <script src="/Scripts/jquery-1.4.1.js" type="text/javascript"></script> 
     <script src="/Scripts/jquery-ui-1/js/jquery-1.7.1.min.js" type="text/javascript"></script> 
    </head> 
    <body> 
     <div class="page"> 
      <h2>Javascript Fiddle</h2> 
      <script> 
      jQuery(document).ready(function() { 
       disableSelection(document.body); 
       //enable certain elements 
       var selectableElements = jQuery('.highlightable'); 
       jQuery.each(selectableElements, function (key, value) { 
        enableSelection(this); 
       }); 
      }); 

      function disableSelection(target) { 
       if (typeof target.onselectstart != "undefined") //IE route 
       { 
        target.onselectstart = function() { 
         return false; 
        }; 
       } 
       else if (typeof target.style.MozUserSelect != "undefined") //Firefox route     
        target.style.MozUserSelect = "none"; 
       else //All other route (ie: Opera)     
        target.onmousedown = function() { return false; }; 
       try { 
        target.style.cursor = "default"; 
       } 
       catch (ex) { 
       } 
      } 

      function enableSelection(target) { 
       if (typeof target.onselectstart != "undefined") { //IE route     
        target.onselectstart = function() { 
         return true; 
        }; 
       } 
       else if (typeof target.style.MozUserSelect != "undefined") //Firefox route     
        target.style.MozUserSelect = "none"; 
       else //All other route (ie: Opera)     
        target.onmousedown = function() { return false; }; 

       target.style.cursor = "default"; 
      } 
      </script> 
      <div id="tableHolder"> 
       <table> 
        <tr><td>abc 12 3</td><td class="highlightable"><input id="testSelection" value="dblClickMe" type="text" /></td></tr> 
        <tr><td>abc 12 3</td><td><input class="highlightable" type="text" /></td></tr> 
        <tr><td>abc 12 3</td><td><input class="highlightable" type="text" /></td></tr> 
        <tr><td>abc 12 3</td><td><input class="highlightable" type="text" /></td></tr> 
       </table> 
      </div> 
      <script src="/Scripts/Fiddle.js" type="text/javascript" ></script> 
     </div> 
    </body> 
</html> 
+1

。あなたは何をしようとしていますか?なぜあなたは 'disableSelection(document.body);'? – BoltClock

+0

上記をご覧ください。私は、入力要素とは別に青色の強調表示を無効にしたい。 – Exitos

答えて

0

を助けることを願って:user-select: none;。あなたは既にjQueryのを使用していることから、私は(あなたのニーズに合わせて変更された)私はjQuery.contextMenuで使用しているコードのこの部分を提供することができます:それは無効自体をであるドキュメント内の何かを可能にしても意味がありません

function abortevent(e){ 
    e.preventDefault(); 
    e.stopImmediatePropagation(); 
}; 

if($.browser.msie) { 
    $(document).on('selectstart.disableTextSelect', 'td', abortevent); 
} else if(!$.browser.mozilla) { 
    $(document).on('mousedown.disableTextSelect', 'td', abortevent); 
} 
+0

申し訳ありませんが、これはIE用ですので、CSSの方法では動作しません... – Exitos

+0

その理由は、私の答えは、JavaScriptの代替を提供しています... – rodneyrehm

関連する問題