我可以阻止Chrome的<textarea>拖放功能嗎？

在Chrome中，<textarea>字段的右下角可以拉動以擴大文本區域。這有時候有它的優點，但有時它並不是。（此討論是另一次。）我可以阻止Chrome的<textarea>拖放功能嗎？

我想知道的是，如果可能的話，我可以如何阻止此行爲。我正在思考一些JS/jQuery dingus的問題，但我真的不知道Google是如何編寫這個功能的。

有沒有人涉足這個？

2011-02-07 Kiwi

onresize：event.preventDefault（），返回false; – kirilloid 2011-02-07 18:58:34

@kirilloid：這將如何顯示給用戶？「」字段的右下角是否還會有一個圖標，但不允許用戶執行任何操作？ – <span class="text-secondary"> <small> <a rel="noopener" target="_blank" href="https://stackoverflow.com/users/419005/">Kiwi</a></span> <span>2011-02-07 19:00:36</span> </small> </span> </p> </div> </div> </div> <div itemprop="comment" class="post-comment"> <div class="row"> <div class="col-lg-1"><span class="text-secondary">+0</span></div> <div class="col-lg-11"> <p class="commenttext">不知道=）我甚至不知道，這是否可行 - 只是一個想法。所以，從答案中使用CSS解決方案。 – <span class="text-secondary"> <small> <a rel="noopener" target="_blank" href="https://stackoverflow.com/users/255363/">kirilloid</a></span> <span>2011-02-07 19:04:40</span> </small> </span> </p> </div> </div> </div> </div> </div> </article> </div> <div class="answer-title"> <span class="text-logo margin-top-sm">A</span> <h2 class="title h4">回答</h2> </div> <div class="item-description text-md markdown-body margin-bottom-40 voidso"> <article class="board-top-1 padding-top-10"> <div class="post-col vote-info"> <span class="count">22<i class="fa fa-thumbs-up"></i></span> <i class="fa fa-check fa-2x"></i> </div> <div class="post-offset"> <div class="answer fmt"> <p>您是否嘗試過使用CSS來阻止它呢？</p> <pre><code class="prettyprint-override">textarea { resize: none; } </code></pre> <p>這應該禁用拖放功能。</p> <p><strong>更新</strong></p> <p>您還可以通過使用jQuery設置該程序：</p> <pre><code class="prettyprint-override">// CSS textarea.no-expand { resize: none; } // jQuery $('#my-text-area').addClass('no-expand'); </code></pre> <p>希望這有助於！</p> </div> <div class="post-info"> <div class="post-meta row"> <p class="text-secondary col-lg-6"> <span class="source"> <a rel="noopener" target="_blank" href="https://stackoverflow.com/q/4925277">來源</a> </span> </p> <p class="text-secondary col-lg-6"> <span class="float-right date"> <span>2011-02-07 19:00:12</span> <a rel="noopener" target="_blank" href="https://stackoverflow.com/users/113342/">CalebHC</a></span> </p> <p class="col-12"></p> <p class="col-12"></p></div> </div> </div> </article> <div> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-6208739752673518" data-ad-slot="1038284119" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> <article class="board-top-1 padding-top-10"> <div class="post-col vote-info"> <span class="count">1<i class="fa fa-thumbs-up"></i></span> </div> <div class="post-offset"> <div class="answer fmt"> <p>也許最簡單的方法是隻指定「調整大小：無」作爲你的風格的一部分：</p> <pre><code class="prettyprint-override">textarea { resize: none } </code></pre> <p>詳情請參閱<a href="http://www.electrictoolbox.com/disable-textarea-resizing-safari-chrome" rel="nofollow">http://www.electrictoolbox.com/disable-textarea-resizing-safari-chrome</a>。</p> </div> <div class="post-info"> <div class="post-meta row"> <p class="text-secondary col-lg-6"> <span class="source"> <a rel="noopener" target="_blank" href="https://stackoverflow.com/q/4925292">來源</a> </span> </p> <p class="text-secondary col-lg-6"> <span class="float-right date"> <span>2011-02-07 19:01:00</span> <a rel="noopener" target="_blank" href="https://stackoverflow.com/users/462202/">Sankalp</a></span> </p> <p class="col-12"></p> <p class="col-12"></p></div> </div> </div> </article> <article class="board-top-1 padding-top-10"> <div class="post-col vote-info"> <span class="count">6<i class="fa fa-thumbs-up"></i></span> </div> <div class="post-offset"> <div class="answer fmt"> <p>晚會有點晚，但這裏。 <code class="prettyprint-override">resize: none</code>解決方案的問題是它不是有效的CSS。這不僅不能驗證，而且不適用於其他瀏覽器，並可能在未來的Chrome版本中打破。一個不同的，有效的解決方案是：</p> <pre><code class="prettyprint-override">textarea { width: 100px; height: 100px; max-width: 100px; max-height: 100px; } </code></pre> <p>當然，你應該相應地調整你的尺寸。當然，這不具有<code class="prettyprint-override">resize: none</code>的靈活性（您不能僅將一種樣式應用於您頁面上的所有<code class="prettyprint-override">textarea</code>），因此，在這方面，<code class="prettyprint-override">resize: none</code>會更好。但是，如果您有可能使用此解決方案，則應該這樣做。</p> </div> <div class="post-info"> <div class="post-meta row"> <p class="text-secondary col-lg-6"> <span class="source"> <a rel="noopener" target="_blank" href="https://stackoverflow.com/q/4925606">來源</a> </span> </p> <p class="text-secondary col-lg-6"> <span class="float-right date"> <span>2011-02-07 19:31:24</span> <a rel="noopener" target="_blank" href="https://stackoverflow.com/users/180784/">Felix</a></span> </p> <p class="col-12"></p> <p class="col-12"></p></div> </div> </div> </article> </div> <div class="clearfix"> </div> <div class="relative-box"> <div class="relative">相關問題</div> <ul class="relative_list"> <li> 1. <a href="http://hk.uwenku.com/question/p-aegqycen-wu.html" target="_blank" title="阻止HTML5從同一元素的多滴拖放功能"> 阻止HTML5從同一元素的多滴拖放功能 </a> </li> <li> 2. <a href="http://hk.uwenku.com/question/p-xrryhrmm-zp.html" target="_blank" title="jQuery的拖放阻止"> jQuery的拖放阻止 </a> </li> <li> 3. <a href="http://hk.uwenku.com/question/p-moqdmmll-bgp.html" target="_blank" title="jqueryUI拖放功能可以使用平板電腦嗎？"> jqueryUI拖放功能可以使用平板電腦嗎？ </a> </li> <li> 4. <a href="http://hk.uwenku.com/question/p-djoyylyi-gp.html" target="_blank" title="我可以阻止Spotlight NSMetadataQuery嗎？"> 我可以阻止Spotlight NSMetadataQuery嗎？ </a> </li> <li> 5. <a href="http://hk.uwenku.com/question/p-ebgiutak-sq.html" target="_blank" title="我可以阻止一個按鈕嗎？"> 我可以阻止一個按鈕嗎？ </a> </li> <li> 6. <a href="http://hk.uwenku.com/question/p-qirpihit-ou.html" target="_blank" title="我可以防止MongoDB :: command（）阻塞嗎？"> 我可以防止MongoDB :: command（）阻塞嗎？ </a> </li> <li> 7. <a href="http://hk.uwenku.com/question/p-qadpvnxj-kw.html" target="_blank" title="WPF拖放阻止操作"> WPF拖放阻止操作 </a> </li> <li> 8. <a href="http://hk.uwenku.com/question/p-xyiwxfgx-bdc.html" target="_blank" title="Chrome請求阻止（實驗功能） - 如何取消阻止？"> Chrome請求阻止（實驗功能） - 如何取消阻止？ </a> </li> <li> 9. <a href="http://hk.uwenku.com/question/p-whatdbfe-gt.html" target="_blank" title="拖放功能"> 拖放功能 </a> </li> <li> 10. <a href="http://hk.uwenku.com/question/p-fdisaesr-gc.html" target="_blank" title="jQuery可拖動仍然可以放空 - 我該如何阻止它？"> jQuery可拖動仍然可以放空 - 我該如何阻止它？ </a> </li> <div> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <ins class="adsbygoogle" style="display:block; text-align:center;" data-ad-layout="in-article" data-ad-format="fluid" data-ad-client="ca-pub-6208739752673518" data-ad-slot="4606349252"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> <li> 11. <a href="http://hk.uwenku.com/question/p-xoupzpkb-xd.html" target="_blank" title="我可以阻止Chrome瀏覽器侵入我的全球媒體資源嗎？"> 我可以阻止Chrome瀏覽器侵入我的全球媒體資源嗎？ </a> </li> <li> 12. <a href="http://hk.uwenku.com/question/p-mictnwdp-oa.html" target="_blank" title="是否可以在chrome-webdriver中拖放？"> 是否可以在chrome-webdriver中拖放？ </a> </li> <li> 13. <a href="http://hk.uwenku.com/question/p-qgcaczld-wa.html" target="_blank" title="jquery拖放功能"> jquery拖放功能 </a> </li> <li> 14. <a href="http://hk.uwenku.com/question/p-mxpnrsqz-ht.html" target="_blank" title="WindowsFormsWebBrowser拖放功能"> WindowsFormsWebBrowser拖放功能 </a> </li> <li> 15. <a href="http://hk.uwenku.com/question/p-yfedwbae-nb.html" target="_blank" title="C＃拖放功能"> C＃拖放功能 </a> </li> <li> 16. <a href="http://hk.uwenku.com/question/p-bgexpomq-sq.html" target="_blank" title="c＃拖放功能"> c＃拖放功能 </a> </li> <li> 17. <a href="http://hk.uwenku.com/question/p-mpkxfxtq-pd.html" target="_blank" title="TableView拖放功能"> TableView拖放功能 </a> </li> <li> 18. <a href="http://hk.uwenku.com/question/p-dcflfnsr-wx.html" target="_blank" title="拖放我的類別排序功能"> 拖放我的類別排序功能 </a> </li> <li> 19. <a href="http://hk.uwenku.com/question/p-wlczblgb-bem.html" target="_blank" title="我簡單的拖放功能口吃"> 我簡單的拖放功能口吃 </a> </li> <li> 20. <a href="http://hk.uwenku.com/question/p-esqozwlr-bcc.html" target="_blank" title="我可以阻止事件被拖過開始和結束邊界嗎？"> 我可以阻止事件被拖過開始和結束邊界嗎？ </a> </li> <li> 21. <a href="http://hk.uwenku.com/question/p-yiqkegkv-xd.html" target="_blank" title="如何阻止拖放頁面的拖放？"> 如何阻止拖放頁面的拖放？ </a> </li> <li> 22. <a href="http://hk.uwenku.com/question/p-zyapfldc-dz.html" target="_blank" title="我可以阻止他人看到我的Python代碼嗎？"> 我可以阻止他人看到我的Python代碼嗎？ </a> </li> <li> 23. <a href="http://hk.uwenku.com/question/p-pyouxhub-eo.html" target="_blank" title="我可以阻止Android殺死我的應用程序嗎？"> 我可以阻止Android殺死我的應用程序嗎？ </a> </li> <li> 24. <a href="http://hk.uwenku.com/question/p-kmfjspem-qp.html" target="_blank" title="我可以阻止excel完全格式化我的文本嗎？"> 我可以阻止excel完全格式化我的文本嗎？ </a> </li> <li> 25. <a href="http://hk.uwenku.com/question/p-ojacgrgs-cc.html" target="_blank" title="我可以阻止DeleteProfileScorable在我的機器人中註冊嗎？"> 我可以阻止DeleteProfileScorable在我的機器人中註冊嗎？ </a> </li> <li> 26. <a href="http://hk.uwenku.com/question/p-ahsnfaey-zv.html" target="_blank" title="我可以阻止某人看到我的JavaScript嗎？"> 我可以阻止某人看到我的JavaScript嗎？ </a> </li> <li> 27. <a href="http://hk.uwenku.com/question/p-mchdhoxs-bnp.html" target="_blank" title="我可以阻止我的捕獲組被覆蓋嗎？"> 我可以阻止我的捕獲組被覆蓋嗎？ </a> </li> <li> 28. <a href="http://hk.uwenku.com/question/p-kcmtfxjg-sk.html" target="_blank" title="我可以阻止網頁上的打印屏幕嗎？有沒有可能？"> 我可以阻止網頁上的打印屏幕嗎？有沒有可能？ </a> </li> <li> 29. <a href="http://hk.uwenku.com/question/p-pjumioyu-rp.html" target="_blank" title="使用可拖放功能顯示div"> 使用可拖放功能顯示div </a> </li> <li> 30. <a href="http://hk.uwenku.com/question/p-sjyagsmw-bmt.html" target="_blank" title="RichTextField中的拖放功能"> RichTextField中的拖放功能 </a> </li> </ul> </div> <div> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-6208739752673518" data-ad-slot="1575177025"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> <div class="padding-top-10"></div> </div> </div> <script type="text/javascript" src="http://img.uwenku.com/uwenku/script/side.js?t=1644592048261"></script> <script type="text/javascript" src="http://img.uwenku.com/uwenku/plugin/highlight/highlight.pack.js"></script> <link href="http://img.uwenku.com/uwenku/plugin/highlight/styles/docco.css" media="screen" rel="stylesheet" type="text/css" /> <script type="text/javascript"> $('pre').each(function(i, e) { hljs.highlightBlock(e, "<span class='indent'> </span>", false) }); </script> <div class="col-lg-3 col-md-4 col-sm-5"> <div id="rightTop"> <div class="row"> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-6208739752673518" data-ad-slot="5415218910" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> <div class="row sidebar panel panel-default"> <div class="panel-heading font-bold"> 最新問題 </div> <div class="m-b-sm m-t-sm clearfix"> <ul class="side_article_list"> <li class="side_article_list_item"> 1. <a href="http://hk.uwenku.com/question/p-dfmtksul-vx.html" target="_blank" title="jQuery的動態CSS屬性（在滾動）"> jQuery的動態CSS屬性（在滾動） </a> </li> <li class="side_article_list_item"> 2. <a href="http://hk.uwenku.com/question/p-vuvasezd-wd.html" target="_blank" title="Eclipse手動/脫機JBoss Tools Luna安裝：缺少需求abc需要'bundle xyz'，但找不到"> Eclipse手動/脫機JBoss Tools Luna安裝：缺少需求abc需要'bundle xyz'，但找不到 </a> </li> <li class="side_article_list_item"> 3. <a href="http://hk.uwenku.com/question/p-cgymfszy-uo.html" target="_blank" title="Laravel登記錯誤，數據庫連接，但收到奇怪的錯誤"> Laravel登記錯誤，數據庫連接，但收到奇怪的錯誤 </a> </li> <li class="side_article_list_item"> 4. <a href="http://hk.uwenku.com/question/p-qybltylb-vh.html" target="_blank" title="highmaps在遷移到.NET Core後停止更新"> highmaps在遷移到.NET Core後停止更新 </a> </li> <li class="side_article_list_item"> 5. <a href="http://hk.uwenku.com/question/p-bkksxbpc-vq.html" target="_blank" title="攔截winsock的recvfrom函數提供了無效地址錯誤"> 攔截winsock的recvfrom函數提供了無效地址錯誤 </a> </li> <li class="side_article_list_item"> 6. <a href="http://hk.uwenku.com/question/p-ayftxvnb-va.html" target="_blank" title="Python對象混入注射"> Python對象混入注射 </a> </li> <li class="side_article_list_item"> 7. <a href="http://hk.uwenku.com/question/p-xwmcdgyo-sg.html" target="_blank" title="批處理文件無法正常工作，除非我正在觀看"> 批處理文件無法正常工作，除非我正在觀看 </a> </li> <li class="side_article_list_item"> 8. <a href="http://hk.uwenku.com/question/p-xggrozic-tb.html" target="_blank" title="司 - SQL"> 司 - SQL </a> </li> <li class="side_article_list_item"> 9. <a href="http://hk.uwenku.com/question/p-zurkldvr-tn.html" target="_blank" title="在C++ Builder中的服務應用程序6"> 在C++ Builder中的服務應用程序6 </a> </li> <li class="side_article_list_item"> 10. <a href="http://hk.uwenku.com/question/p-xvogfpaq-py.html" target="_blank" title="Spring REST：適用於嵌套XML請求正文的構造函數嗎？"> Spring REST：適用於嵌套XML請求正文的構造函數嗎？ </a> </li> </ul> </div> </div> </div> <p class="article-nav-bar"></p> <div class="row sidebar article-nav"> <div class="row box_white visible-sm visible-md visible-lg margin-zero"> <div class="top"> <h3 class="title"><i class="glyphicon glyphicon-th-list"></i> 相關問題</h3> </div> <div class="article-relative-content"> <ul class="side_article_list"> <li class="side_article_list_item"> 1. <a href="http://hk.uwenku.com/question/p-aegqycen-wu.html" target="_blank" title="阻止HTML5從同一元素的多滴拖放功能"> 阻止HTML5從同一元素的多滴拖放功能 </a> </li> <li class="side_article_list_item"> 2. <a href="http://hk.uwenku.com/question/p-xrryhrmm-zp.html" target="_blank" title="jQuery的拖放阻止"> jQuery的拖放阻止 </a> </li> <li class="side_article_list_item"> 3. <a href="http://hk.uwenku.com/question/p-moqdmmll-bgp.html" target="_blank" title="jqueryUI拖放功能可以使用平板電腦嗎？"> jqueryUI拖放功能可以使用平板電腦嗎？ </a> </li> <li class="side_article_list_item"> 4. <a href="http://hk.uwenku.com/question/p-djoyylyi-gp.html" target="_blank" title="我可以阻止Spotlight NSMetadataQuery嗎？"> 我可以阻止Spotlight NSMetadataQuery嗎？ </a> </li> <li class="side_article_list_item"> 5. <a href="http://hk.uwenku.com/question/p-ebgiutak-sq.html" target="_blank" title="我可以阻止一個按鈕嗎？"> 我可以阻止一個按鈕嗎？ </a> </li> <li class="side_article_list_item"> 6. <a href="http://hk.uwenku.com/question/p-qirpihit-ou.html" target="_blank" title="我可以防止MongoDB :: command（）阻塞嗎？"> 我可以防止MongoDB :: command（）阻塞嗎？ </a> </li> <li class="side_article_list_item"> 7. <a href="http://hk.uwenku.com/question/p-qadpvnxj-kw.html" target="_blank" title="WPF拖放阻止操作"> WPF拖放阻止操作 </a> </li> <li class="side_article_list_item"> 8. <a href="http://hk.uwenku.com/question/p-xyiwxfgx-bdc.html" target="_blank" title="Chrome請求阻止（實驗功能） - 如何取消阻止？"> Chrome請求阻止（實驗功能） - 如何取消阻止？ </a> </li> <li class="side_article_list_item"> 9. <a href="http://hk.uwenku.com/question/p-whatdbfe-gt.html" target="_blank" title="拖放功能"> 拖放功能 </a> </li> <li class="side_article_list_item"> 10. <a href="http://hk.uwenku.com/question/p-fdisaesr-gc.html" target="_blank" title="jQuery可拖動仍然可以放空 - 我該如何阻止它？"> jQuery可拖動仍然可以放空 - 我該如何阻止它？ </a> </li> </ul> </div> </div> </div> </div> </div> </div> </div>  <footer id="footer"> <div class="bg-simple lt"> <div class="container"> <div class="row padder-v m-t"> <div class="col-xs-8"> <ul class="list-inline"> <li><a href="http://hk.uwenku.com/contact">聯系我們</a></li> <li>© 2020 HK.UWENKU.COM</li> <li><a target="_blank" href="https://beian.miit.gov.cn/">沪ICP备13005482号-4</a></li> <li><script type="text/javascript" src="https://v1.cnzz.com/z_stat.php?id=1280101193&web_id=1280101193"></script></li> <li><a href="http://www.uwenku.com/" target="_blank" title="优文库">简体中文</a></li> <li><a href="http://hk.uwenku.com/" target="_blank" title="優文庫">繁體中文</a></li> <li><a href="http://ru.uwenku.com/" target="_blank" title="поле вопросов и ответов">Русский</a></li> <li><a href="http://de.uwenku.com/" target="_blank" title="Frage - und - antwort - Park">Deutsch</a></li> <li><a href="http://es.uwenku.com/" target="_blank" title="Preguntas y respuestas">Español</a></li> <li><a href="http://hi.uwenku.com/" target="_blank" title="कार्यक्रम प्रश्न और उत्तर पार्क">हिन्दी</a></li> <li><a href="http://it.uwenku.com/" target="_blank" title="IL Programma di chiedere Park">Italiano</a></li> <li><a href="http://ja.uwenku.com/" target="_blank" title="プログラム問答園区">日本語</a></li> <li><a href="http://ko.uwenku.com/" target="_blank" title="프로그램 문답 단지">한국어</a></li> <li><a href="http://pl.uwenku.com/" target="_blank" title="program o park">Polski</a></li> <li><a href="http://tr.uwenku.com/" target="_blank" title="Program soru ve cevap parkı">Türkçe</a></li> <li><a href="http://vi.uwenku.com/" target="_blank" title="Đáp ứng viên">Tiếng Việt</a></li> <li><a href="http://fr.uwenku.com/" target="_blank" title="Programme interrogation Park">Française</a></li> </ul> </div> </div> </div> </div> </div> </footer>  <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?f78a970f17b19a79fc477a3378096f29"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> </body> </html>