2017-12-24 72 views
5

मैं निम्नलिखित कोड चाहता हूं, ताकि बटन दबाया जा सके, यह पाठ क्षेत्र की सामग्री को नीचे से ऊपर तक स्क्रॉल करता है।<textarea> स्क्रॉल करने के लिए जावास्क्रिप्ट शीर्ष पर वापस

$("button").on("click", function() { 
 
    $(document).ready(function() { 
 
    var $textarea = $('#update'); 
 
    $textarea.scrollTop($textarea[0].scrollHeight); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button>Scroll</button> 
 
<textarea Name="update" Id="update" cols="50" rows="25"></textarea>

+0

[स्क्रॉल jQuery-Textarea के शीर्ष करने के लिए] (https://stackoverflow.com/questions/ 16673159/स्क्रॉल-टू-टॉप-ऑफ-jquery-textarea) | बस '$ textarea.scrollTop ($ textarea [0] .scrollHeight) बदलें; '=>' $ textarea.scrollTop (0); ' – Pedram

+0

' क्लिक 'फ़ंक्शन के अंदर' document.ready' न डालें! – Pedram

उत्तर

5

बदलें निम्न पंक्ति $textarea.scrollTop($textarea[0].scrollHeight);$textarea.scrollTop(0); को textarea के शीर्ष करने के लिए स्क्रॉल करने के लिए।

$("button").on("click", function() { 
 
    var $textarea = $('#update'); 
 
    $textarea.scrollTop(0); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button>Scroll</button> 
 
<textarea Name="update" Id="update" cols="50" rows="25"></textarea>

+0

डाउनवोट क्यों? मैंने इसका परीक्षण किया और यह सवाल पूछा गया कि – cdoshi

+0

यह काम करता है! मैं इस में अंतिम और शीर्ष फ़ंक्शन दोनों स्क्रॉल का उपयोग कैसे कर सकता हूं? –

+0

$ textarea.scrollTop ($ textarea [0] .scrollHeight); आपको नीचे ले जाएगा। आपको शायद दो बटनों की आवश्यकता होगी (आवश्यकताओं पर निर्भर करता है) एक जो आपको शीर्ष पर ले जाएगा और क्लिक पर अन्य आपको नीचे ले जाएगा। – cdoshi

0

इस जावास्क्रिप्ट कोड का प्रयास करें। ऊपर सेट करें और 0 से बाएं और टेक्स्टिएरा को नीचे से ऊपर तक स्क्रॉल करें। यहाँ

function scrolltop() { 
 
    var scr_top = document.getElementById("update"); 
 
    scr_top.scrollLeft = 0; 
 
    scr_top.scrollTop = 0; 
 
}
<!DOCTYPE html> 
 
<html lang="en"> 
 

 
<head> 
 
</head> 
 

 
<body> 
 
    <button onclick="scrolltop()">Scroll</button> 
 
    <textarea name="update" id="update" cols="50" rows="25"></textarea> 
 
</body> 
 

 
</html>

0

दो मुद्दों:

  1. document.ready JQuery के किसी भी उपयोग करने से पहले बाहरी गुंजाइश पर जाँच की जानी चाहिए,।
  2. तत्व ऊपर तक स्क्रॉल के लिए, स्क्रॉल मान होना चाहिए 0

इसलिए:

$(document).ready(function() { 
    $("button").on("click", function() { 
     var $textarea = $('#update'); 
     $textarea.scrollTop(0); 
    }); 
    }); 
0

यहाँ पूरा कोड है।

बटन पर क्लिक करने पर, सामग्री नीचे और/या टैग की सामग्री के शीर्ष पर नेविगेट होगा

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<button id="last">Scroll to bottom</button> 
<textarea Name="update" Id="update" cols="50" rows="25"></textarea> 

<script> 
$(document).ready(function() { 
    $("#last").on("click", function() { 
    var $textarea = $('#update'); 
    $textarea.scrollTop($textarea[0].scrollHeight); 
    }); 
}); 
</script> 

<button id="first">Move to Top</button> 

<script> 
$(document).ready(function() { 
    $("#first").on("click", function() { 
    var $textarea = $('#update'); 
    $textarea.scrollTop(0); 
    }); 
}); 
</script> 
संबंधित मुद्दे