জাভাস্ক্রিপ্টে টেক্সটরিয়া থেকে নির্বাচিত পাঠ্য অবস্থান কীভাবে পাবেন?

Question

আমি জাভাস্ক্রিপ্ট ব্যবহার করে নির্বাচিত পাঠ্য অবস্থান পেতে চাই। উদাহরণস্বরূপ,
আমার একটি সাধারণ পাঠ্য আছে।

#input-text {
  resize: none;
  width: 50%;
  height: 50px;
  margin: 1rem auto;
}

<textarea id="input-text">I am a student and I want to become a good person</textarea>

আমার টেক্সটরিয়ায় আমার কিছু লেখা রয়েছে যেমন:

"I am a student and I want to become a good person"

এই স্ট্রিং থেকে, যদি আমি টেক্সেরিয়া থেকে "একজন ভাল ব্যক্তি হয়ে উঠি" নির্বাচন করি তবে আমি
জাভাস্ক্রিপ্টে নির্বাচিত পাঠ্য / স্ট্রিং অবস্থানটি কীভাবে পেতে পারি?


এখানে নির্বাচিত স্ট্রিং চরিত্রটি 29 থেকে শুরু হয়ে 49 এ শেষ হয় So সুতরাং শুরু করার অবস্থানটি 29 এবং শেষের অবস্থানটি 49 49

Comments

অবস্থান অনুসারে আপনি বোঝাতে চান স্ট্রিংয়ের "বি" বর্ণের "বি" এর সূচকটি কী?

— পালা

আমি মনে করি যে প্রশ্নটি এইচটিএমএল ইনপুট এলিমেট.লেকশন স্টার্ট এবং সিলেকশনের জন্য জিজ্ঞাসা করছে এবং উত্তরগুলি বেশিরভাগ নির্বাচনের ইভেন্ট সম্পর্কে কথা বলে। যদিও অন্য সমস্ত উত্তরের অন্তর্ভুক্ত এমন কোনও উত্তর লেখার কোনও অর্থ নেই।

— জলি জোকার

এটা কি তোমার প্রশ্নের উত্তর? জাভাস্ক্রিপ্টের সাহায্যে পাঠ্যবক্স নিয়ন্ত্রণ থেকে নির্বাচিত পাঠ্য কীভাবে পাবেন

— ম্যাটসেম্যান

Answer 1

এটি পৃষ্ঠায় সমস্ত পাঠ্য উপাদানগুলির জন্য মাউস এবং কীবোর্ডের সাহায্যে পাঠ্য নির্বাচনের জন্য কাজ করবে। হয় নির্বাচক পরিবর্তন করতে এবং সেখানে আরও সুনির্দিষ্ট হওয়ার বিষয়ে নিশ্চিত হয়ে নিন এবং আপনার কিবোর্ড নির্বাচনের প্রয়োজন / না চাইলে মন্তব্যগুলি পড়ুন।

var mySelection = function (element) {
    let startPos = element.selectionStart;
    let endPos = element.selectionEnd;
    let selectedText = element.value.substring(startPos, endPos);

    if(selectedText.length <= 0) {
      return; // stop here if selection length is <= 0
    }
    
    // log the selection
    console.log("startPos: " + startPos, " | endPos: " + endPos );
    console.log("selectedText: " +  selectedText);

  };

var textAreaElements = document.querySelectorAll('textarea');
[...textAreaElements].forEach(function(element) {
    // register "mouseup" event for the mouse
    element.addEventListener('mouseup', function(){
        mySelection(element)
    });
    
    // register "keyup" event for the keyboard
    element.addEventListener('keyup', function( event ) {
        // assuming we need CTRL, SHIFT or CMD key to select text
        // only listen for those keyup events
        if(event.keyCode == 16 || event.keyCode == 17 || event.metaKey) {
            mySelection(element)
        }
    });
});

textarea {
   resize: none; 
   width: 50%;
   height: 50px; 
   margin: 1rem auto;
}

<textarea>I am a student and I want to become a good person</textarea>

Comments

বেশ ঝরঝরে. +1

— সহার্শ

আপনি মাউসের পরিবর্তে কীবোর্ড ব্যবহার করে নির্বাচন করলে এটি আগুনে না doesn't

— কৌতূহলীনি

— @ কুরিয়াসনদনী

Answer 2

আমি একই পেতে অনসलेक्ट ইভেন্টটি ব্যবহার করব ।

<textarea id="input-text" onselect="myFunction(event)">I am a student and I want to become a good person</textarea>


<script>
    function myFunction(event) {
      const start  = event.currentTarget.selectionStart;
      const end= event.currentTarget.selectionEnd;
    }
</script>

Answer 3

    var idoftextarea='answer';
    function getSelectedText(idoftextarea){
        var textArea = document.getElementById(idoftextarea);
        var text =textArea.value;
        var indexStart=textArea.selectionStart;
        var indexEnd=textArea.selectionEnd;
        alert(text.substring(indexStart, indexEnd));

    }


    getSelectedText(idoftextarea);

Answer 4

কারাম্বার উত্তরটি বেশ দুর্দান্ত কাজ করেছে, তবে আমার কাছে সমস্যা ছিল যে আপনি যদি কিছু পাঠ্য নির্বাচন করেন এবং টেক্সারিয়ার বাইরে মাউস ছেড়ে দেন তবে ইভেন্টটি আগুন দেয় না।

এটি সমাধানের জন্য আমি প্রাথমিক ইভেন্টটি এতে পরিবর্তন করেছিলাম mousedown, এই ইভেন্টটি mouseupকার্সার প্রকাশিত হওয়ার পরে এটি প্রবাহিত হয় তা নিশ্চিত করতে নথিতে একটি ইভেন্ট নিবন্ধভুক্ত করে। mouseupঘটনা তারপর নিজেই সরিয়ে ফেলা হবে পরে এটি বহিস্কার করেছে।

এটি onceবিকল্পটি যোগ করার মাধ্যমে অর্জন করা যেতে পারে addEventListener, তবে দুঃখের সাথে আই 11 এ সমর্থন করা যায় না কারণ আমি স্নিপেটে সমাধানটি ব্যবহার করেছি।

var mySelection = function (element) {
    let startPos = element.selectionStart;
    let endPos = element.selectionEnd;
    let selectedText = element.value.substring(startPos, endPos);

    if(selectedText.length <= 0) {
      return; // stop here if selection length is <= 0
    }
    
    // log the selection
    console.log("startPos: " + startPos, " | endPos: " + endPos );
    console.log("selectedText: " +  selectedText);
};

function addSelfDestructiveEventListener (element, eventType, callback) {
    let handler = () => {
        callback();
        element.removeEventListener(eventType, handler);
    };
    element.addEventListener(eventType, handler);
};

var textAreaElements = document.querySelectorAll('textarea');
[...textAreaElements].forEach(function(element) {
    // register "mouseup" event for those
    element.addEventListener('mousedown', function(){
      // This will only run the event once and then remove itself
      addSelfDestructiveEventListener(document, 'mouseup', function() {
        mySelection(element)
      })
    });
    
    // register "keyup" event for the keyboard
    element.addEventListener('keyup', function( event ) {
        // assuming we need CTRL, SHIFT or CMD key to select text
        // only listen for those keyup events
        if(event.keyCode == 16 || event.keyCode == 17 || event.metaKey) {
            mySelection(element)
        }
    });
});

textarea {
   resize: none; 
   width: 50%;
   height: 50px; 
   margin: 1rem auto;
}

<textarea>I am a student and I want to become a good person</textarea>

Comments

আপনি কীভাবে প্রয়োগ করেছেন তা আমি পছন্দ করি addSelfDestructiveEventListener !

— ক্যারামবা

Answer 5

var mySelection = function (element) {
let startPos = element.selectionStart;
let endPos = element.selectionEnd;
let selectedText = element.value.substring(startPos, endPos);

if(selectedText.length <= 0) {
  return; // stop here if selection length is <= 0
}

// log the selection
console.log("startPos: " + startPos, " | endPos: " + endPos );
console.log("selectedText: " +  selectedText); };var textAreaElements = document.querySelectorAll('textarea'); 
[...textAreaElements].forEach(function(element) {
// register "mouseup" event for the mouse
element.addEventListener('mouseup', function(){
    mySelection(element)
});
// register "keyup" event for the keyboard
element.addEventListener('keyup', function( event ) {
    // assuming we need CTRL, SHIFT or CMD key to select text
    // only listen for those keyup events
    if(event.keyCode == 16 || event.keyCode == 17 || event.metaKey) {
        mySelection(element)
    }
});});

Comments

আপনি দয়া করে আপনার কোডটি যা করেন তার একটি সামান্য ব্যাখ্যা যোগ করতে পারেন?

— রাহেল ম্যাকগুইগান