আমি কীভাবে টেক্সারিয়া স্ক্রোল বারটিকে ডিফল্ট হিসাবে নীচে সেট করব?


97

আমার কাছে একটি টেক্সারিয়া রয়েছে যা ব্যবহারকারী ইনপুটটি প্রেরণ করা হচ্ছে বলে গতিশীলভাবে পুনরায় লোড করা হচ্ছে It এটি প্রতি কয়েক সেকেন্ডে নিজেকে সতেজ করে। এই টেক্সারিয়ায় পাঠ্যের পরিমাণ যখন টেক্সারিয়ার আকার ছাড়িয়ে যায়, তখন একটি স্ক্রোল বার উপস্থিত হয়। তবে স্ক্রোল বারটি সত্যিই ব্যবহারযোগ্য নয় কারণ আপনি যদি নীচে স্ক্রোলিং শুরু করেন তবে কয়েক সেকেন্ড পরে টেক্সারিয়া রিফ্রেশ করে স্ক্রোল বারটি ডান উপরে উপরে নিয়ে আসে। আমি ডিফল্টরূপে নীচে সর্বাধিক পাঠ্য দেখিয়ে স্ক্রোল বারটি সেট করতে চাই। কারও ধারণা আছে কীভাবে এটি করা যায়?


উত্তর:


190

ভ্যানিলা জাভাস্ক্রিপ্টে খুব সহজ:

var textarea = document.getElementById('textarea_id');
textarea.scrollTop = textarea.scrollHeight;

আপনি যদি একই কোড ব্লকে কেবল টেক্সারিয়া লোড করেন তবে এটি কার্যকর হয় না। এটি সঠিকভাবে কাজ করার জন্য, এই কোডটি একটি পৃথক ফাংশনে রাখুন এবং তারপরে আপনি নতুন টেক্সারিয়া মান লোড করার পরে এটি কল করুন। তারপরে এটি পছন্দসইভাবে কাজ করবে।
blissweb

55

আপনি jQuery এর সাথে এটি ব্যবহার করতে পারেন

$(document).ready(function(){
    var $textarea = $('#textarea_id');
    $textarea.scrollTop($textarea[0].scrollHeight);
});

jQuery এর সাথে সত্যই পরিচিত নয়। আমি কি কেবল এটি জাভাস্ক্রিপ্টের মতো একই জায়গায় রেখে দেব বা আমাকে কি নতুন <script> উপাদান তৈরি করতে হবে এবং একটি নতুন ধরণের নির্দিষ্ট করতে হবে?
মোয়েসেফ

4
যোগ <স্ক্রিপ্ট ভাষা = 'জাভাস্ক্রিপ্ট' src = ' ajax.googleapis.com/ajax/libs/jquery/1.7.1/... > ট্যাগ :)
উইল পি

8
কোনও খারাপ ধারণা মত প্লেইন জেএস সাউন্ডে আপনি করতে পারেন এমন কিছু করার জন্য সাইট প্রশস্ত নির্ভরতা যুক্ত করা। কেবল আপনার অর্থ হওয়া উচিত নয় বলে।
এমিক্স

0

আমারও একই সমস্যা ছিল এবং আমি জানতে পারি যে সঠিক স্ক্রোলিং আচরণ পেতে প্রাথমিকভাবে সেট করা যেতে পারে এমন কোনও বৈশিষ্ট্য নেই। তবে পাঠ্যআরিয়ায় একবার টেক্সট আপডেট হয়ে গেলে, একই ফাংশনটির সাথে সাথেই আপনি পাঠ্যআরিয়াকে নীচে স্ক্রোল করতে ফোকাসটি () সেট করতে পারেন। এরপরে focus()ব্যবহারকারীকে সেই ক্ষেত্রে ইনপুট দেওয়ার অনুমতি দেওয়ার জন্য আপনি অন্য কোনও ইনপুট ফিল্ডে কল করতে পারেন । এটি কবজির মতো কাজ করে:

function myFunc() {
    var txtArea = document.getElementById("myTextarea");
    txtArea.value += "whatever"; // doesn't matter how it is updated
    txtArea.focus();
    var someOtherElem = document.getElementById("smallInputBox");
    someOtherElem.focus();
}

0

আপনার এইচটিএমএলে ...

<textarea id="logTextArea" style="width:600px;height:200px;"></textarea>

আপনার জাভাস্ক্রিপ্টে ...

<script language="javascript">

    function loadLog(logValue) {
        logTa = document.getElementById("logTextArea")
        logTa.value = logValue;
        scrollLogToBottom()
    }

    function scrollLogToBottom() {
        logTa = document.getElementById("logTextArea")
        logTa.scrollTop = logTa.scrollHeight;
    }

    loadLog("This is my really long text block from a file ... ")

</script>

আমি খুঁজে পেয়েছি যে টেক্সট এরিয়ায় নতুন মান লোড করার পরে আপনাকে স্ক্রোলহাইটটি আলাদা ফাংশনে সেট করার জন্য কোডটি লাগাতে হবে।

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.