JQuery বা jQuery-UI প্রদত্ত নথি উপাদানগুলির জন্য পাঠ্য নির্বাচন অক্ষম করার জন্য কোনও কার্যকারিতা রয়েছে কি?
JQuery বা jQuery-UI প্রদত্ত নথি উপাদানগুলির জন্য পাঠ্য নির্বাচন অক্ষম করার জন্য কোনও কার্যকারিতা রয়েছে কি?
উত্তর:
JQuery 1.8 এ, নিম্নলিখিত হিসাবে এটি করা যেতে পারে:
(function($){
$.fn.disableSelection = function() {
return this
.attr('unselectable', 'on')
.css('user-select', 'none')
.on('selectstart', false);
};
})(jQuery);
আপনি যদি jQuery UI ব্যবহার করেন তবে তার জন্য একটি পদ্ধতি রয়েছে তবে এটি কেবল মাউস নির্বাচন পরিচালনা করতে পারে (যেমন CTRL+ Aএখনও কাজ করছে):
$('.your-element').disableSelection(); // deprecated in jQuery UI 1.9
কোডটি রিয়েল সহজ, আপনি যদি jQuery UI ব্যবহার করতে না চান:
$(el).attr('unselectable','on')
.css({'-moz-user-select':'-moz-none',
'-moz-user-select':'none',
'-o-user-select':'none',
'-khtml-user-select':'none', /* you could also put this in a class */
'-webkit-user-select':'none',/* and add the CSS class here instead */
'-ms-user-select':'none',
'user-select':'none'
}).bind('selectstart', function(){ return false; });
আমি এই উত্তরটি ( পাঠ্য সারণীর হাইলাইট প্রতিরোধ করা ) সবচেয়ে সহায়ক খুঁজে পেয়েছি এবং সম্ভবত এটি IE সামঞ্জস্যতা দেওয়ার অন্য কোনও পদ্ধতির সাথে একত্রিত হতে পারে।
#yourTable
{
-moz-user-select: none;
-khtml-user-select: none;
-webkit-user-select: none;
user-select: none;
}
সংযোগ বিচ্ছিন্ন নির্বাচন এবং আরও কিছু গরম কী (যেমন Ctrl+ aএবং Ctrl+ c। টেস্ট: Cmd + aএবং Cmd+ c) বাতিল করার আরও বিস্তৃত সমাধান এখানে রয়েছে's
(function($){
$.fn.ctrlCmd = function(key) {
var allowDefault = true;
if (!$.isArray(key)) {
key = [key];
}
return this.keydown(function(e) {
for (var i = 0, l = key.length; i < l; i++) {
if(e.keyCode === key[i].toUpperCase().charCodeAt(0) && e.metaKey) {
allowDefault = false;
}
};
return allowDefault;
});
};
$.fn.disableSelection = function() {
this.ctrlCmd(['a', 'c']);
return this.attr('unselectable', 'on')
.css({'-moz-user-select':'-moz-none',
'-moz-user-select':'none',
'-o-user-select':'none',
'-khtml-user-select':'none',
'-webkit-user-select':'none',
'-ms-user-select':'none',
'user-select':'none'})
.bind('selectstart', false);
};
})(jQuery);
এবং কল উদাহরণ:
$(':not(input,select,textarea)').disableSelection();
এটি ফায়ারফক্সের পুরানো সংস্করণগুলির জন্যও যথেষ্ট নয় (আমি কোনটি বলতে পারি না)। যদি এই সমস্ত কাজ না করে তবে নিম্নলিখিতগুলি যুক্ত করুন:
.on('mousedown', false)
attr('unselectable', 'on')
দু'বার ফোন দিলে কেন ? এটি একটি টাইপো বা এটি দরকারী?
নিম্নলিখিতগুলি সমস্ত সাধারণ ব্রাউজারগুলিতে (আই, ক্রোম, মজিলা, অপেরা এবং সাফারি) সমস্ত শ্রেণীর আইটেম নির্বাচন নিষ্ক্রিয় করবে:
$(".item")
.attr('unselectable', 'on')
.css({
'user-select': 'none',
'MozUserSelect': 'none'
})
.on('selectstart', false)
.on('mousedown', false);
$(document).ready(function(){
$("body").css("-webkit-user-select","none");
$("body").css("-moz-user-select","none");
$("body").css("-ms-user-select","none");
$("body").css("-o-user-select","none");
$("body").css("user-select","none");
});
এটি সহজে জাভাস্ক্রিপ্ট ব্যবহার করে করা যেতে পারে এটি সমস্ত ব্রাউজারের জন্য প্রযোজ্য
<script type="text/javascript">
/***********************************************
* Disable Text Selection script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
function disableSelection(target){
if (typeof target.onselectstart!="undefined") //For IE
target.onselectstart=function(){return false}
else if (typeof target.style.MozUserSelect!="undefined") //For Firefox
target.style.MozUserSelect="none"
else //All other route (For Opera)
target.onmousedown=function(){return false}
target.style.cursor = "default"
}
</script>
এই ফাংশন কল
<script type="text/javascript">
disableSelection(document.body)
</script>
এটি আসলে খুব সহজ। পাঠ্য নির্বাচনটি অক্ষম করতে (এবং + টেনে আনার-পাঠ্য (উদাহরণস্বরূপ Chrome এ একটি লিঙ্ক) ক্লিক করুন), কেবলমাত্র নিম্নলিখিত jQuery কোডটি ব্যবহার করুন:
$('body, html').mousedown(function(event) {
event.preventDefault();
});
এইগুলি হ'ল ডিফল্টটি ঘটতে বাধা দেয় যখন আপনি ট্যাগ এবং ট্যাগগুলিতে মাউস ( mousedown()
) দিয়ে ক্লিক করেন । আপনি খুব সহজেই দুটি কোট-এর মধ্যে টেক্সটটি অভ্যন্তরীণ পরিবর্তন করে খুব সহজেই উপাদানটি পরিবর্তন করতে পারেন (উদাহরণস্বরূপ পরিবর্তন করতে পরিবর্তন করুন)body
html
$('body, html')
$('#myUnselectableDiv')
myUnselectableDiv
হতে DIV আছে, ভাল, unselectable।
এটি দেখানোর / প্রমাণ করার জন্য একটি দ্রুত স্নিপেট:
$('#no-select').mousedown(function(event) {
event.preventDefault();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span id="no-select">I bet you can't select this text, or drag <a href="#">this link</a>, </span>
<br/><span>but that you can select this text, and drag <a href="#">this link</a>!</span>
দয়া করে মনে রাখবেন যে এই প্রভাবটি নিখুঁত নয় এবং পুরো উইন্ডোটি নির্বাচনযোগ্য না করার সময় সেরা সঞ্চালন করে। আপনি যোগ করতে চাইবেন
হট কী কিছু বাতিলের (যেমন Ctrl+aএবং Ctrl+c। টেস্ট: Cmd+a এবং Cmd+c)
পাশাপাশি, উপরে ভ্লাদিমিরের উত্তরের সেই অংশটি ব্যবহার করে। ( এখানে তার পোস্ট পেতে )
ক্রোমের জন্য 1 লাইন সমাধান:
body.style.webkitUserSelect = "none";
এবং এফএফ:
body.style.MozUserSelect = "none";
আইইয়ের জন্য "অপছন্দযোগ্য" বৈশিষ্ট্য (নীচে বিশদ) সেট করা দরকার।
আমি এটি ক্রোমে পরীক্ষা করেছি এবং এটি কাজ করে। এই সম্পত্তিটি উত্তরাধিকার সূত্রে প্রাপ্ত তাই শরীরের উপাদান এ সেট করা আপনার পুরো দস্তাবেজের নির্বাচনকে অক্ষম করবে।
বিশদ এখানে: http://help.dottoro.com/ljrlukea.php
আপনি যদি ক্লোজার ব্যবহার করছেন, কেবল এই ফাংশনটি কল করুন:
goog.style.setUnselectable(myElement, true);
এটি সমস্ত ব্রাউজারকে স্বচ্ছভাবে পরিচালনা করে।
নন-আইই ব্রাউজারগুলি এইভাবে পরিচালনা করা হয়:
goog.style.unselectableStyle_ =
goog.userAgent.GECKO ? 'MozUserSelect' :
goog.userAgent.WEBKIT ? 'WebkitUserSelect' :
null;
এখানে সংজ্ঞায়িত: http://closure-library.googlecode.com/svn/!svn/bc/4/trunk/closure/goog/docs/closure_goog_style_style.js.source.html
আই আই অংশটি এভাবে পরিচালনা করা হয়:
if (goog.userAgent.IE || goog.userAgent.OPERA) {
// Toggle the 'unselectable' attribute on the element and its descendants.
var value = unselectable ? 'on' : '';
el.setAttribute('unselectable', value);
if (descendants) {
for (var i = 0, descendant; descendant = descendants[i]; i++) {
descendant.setAttribute('unselectable', value);
}
}
আমি মনে করি এই কোডটি সমস্ত ব্রাউজারগুলিতে কাজ করে এবং কমপক্ষে ওভারহেডের প্রয়োজন। এটি সত্যিই উপরের সমস্ত উত্তরের একটি সংকর। আপনি যদি বাগ খুঁজে পান তবে আমাকে জানান!
সিএসএস যুক্ত করুন:
.no_select { user-select: none; -o-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -ms-user-select:none;}
JQuery যুক্ত করুন:
(function($){
$.fn.disableSelection = function()
{
$(this).addClass('no_select');
if($.browser.msie)
{
$(this).attr('unselectable', 'on').on('selectstart', false);
}
return this;
};
})(jQuery);
Alচ্ছিক: সমস্ত বাচ্চার উপাদানগুলির জন্য নির্বাচনকে অক্ষম করতে, আপনি IE ব্লকটি এতে পরিবর্তন করতে পারেন:
$(this).each(function() {
$(this).attr('unselectable','on')
.bind('selectstart',function(){ return false; });
});
ব্যবহার:
$('.someclasshere').disableSelection();
উপযুক্ত ক্ষেত্রে এটির জন্য একটি সমাধান হ'ল আপনি <button>
যে পাঠ্যটি নির্বাচনযোগ্য হতে চান না তার জন্য একটি ব্যবহার করা। আপনি যদি click
কিছু টেক্সট ব্লকের ইভেন্টের সাথে আবদ্ধ হন , এবং চান না যে পাঠ্যটি নির্বাচনযোগ্য হয়, এটিকে একটি বোতাম হিসাবে রূপান্তর করা শব্দার্থবিজ্ঞানের উন্নতি ঘটায় এবং পাঠ্যটি নির্বাচিত হওয়া প্রতিরোধ করবে।
<button>Text Here</button>
আমি এটি খুঁজে পেয়েছি সেরা এবং সহজ উপায়, ctrl + c প্রতিরোধ করে, ডান ক্লিক। এই ক্ষেত্রে আমি সমস্ত কিছু অবরুদ্ধ করেছি, সুতরাং আমাকে কিছু নির্দিষ্ট করতে হবে না।
$(document).bind("contextmenu cut copy",function(e){
e.preventDefault();
//alert('Copying is not allowed');
});