Bài viết này với việc sử dụng một số chức năng JavaScript sẽ xem cách sao chép nội dung có trong TextArea. Ngoài ra, làm thế nào để tải xuống dưới dạng dữ liệu tệp có trong TextArea. ID phần tử ID phần tử đầu vào HTML DOM (Mô hình đối tượng Documnet) sẽ nhận được bằng cách sử dụng phương thức document.getEuityById (). Với việc sử dụng ID, chúng tôi sao chép các giá trị có trong TextArea bằng cách sử dụng hàm addEventListener () trong javascript. Mã dưới đây là một trong những ví dụ về sao chép nội dung trong textarea <html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
.purple-border textarea {
border: 1px solid #ba68c8;
}
.purple-border .form-control:focus {
border: 1px solid #ba68c8;
box-shadow: 0 0 0 0.2rem rgba(186, 104, 200, .25);
}
</style>
</head>
<body>
<button class="btn btn-primary" id="copyID" style="margin-left: 280px;">
<i class="fa fa-copy"></i>
</button>
<textarea class="form-control" id="textareainput" rows="5" cols="20">Text area input</textarea>
</div>
<script>
var button = document.getElementById("copyID"),
input = document.getElementById("textareainput");
button.addEventListener("click", function(event) {
event.preventDefault();
input.select();
document.execCommand("copy");
});
</script>
</body>
</html>
Đầu ra mã này sẽ giống như một nút TextArea & NBSP đơn giản Sau khi nhấp vào Sao chép Botton, nó sẽ chọn giá trị biểu thị giá trị như đã được sao chép Bây giờ chúng tôi đi với cách tải xuống dưới dạng nội dung tệp có trong TextArea. Để tải xuống cũng nhận được giá trị TextArea bằng cách sử dụng phần tử DOM và được tải xuống dưới dạng tệp văn bản đơn giản. Mã dưới đây là một ví dụ về tải xuống tệp. <html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
.purple-border textarea {
border: 1px solid #ba68c8;
}
.purple-border .form-control:focus {
border: 1px solid #ba68c8;
box-shadow: 0 0 0 0.2rem rgba(186, 104, 200, .25);
}
</style>
</head>
<body>
<button class="btn btn-primary" id="copyID" style="margin-left: 280px;">
<i class="fa fa-copy"></i>
</button>
<div class="form-group purple-border" style="width:500px;align:center">
<textarea class="form-control" id="textareainput" rows="5" cols="20">Text area input</textarea>
</div>
<script>
var button = document.getElementById("copyID"),
input = document.getElementById("textareainput");
button.addEventListener("click", function(event) {
event.preventDefault();
input.select();
document.execCommand("copy");
});
// Start file download.
document.getElementById("downloadbutton").addEventListener("click", function() {
// Generate download of hello.txt
// file with some content
var text = document.getElementById("textareainput").value;
var filename = "TextareaInput.txt";
download(filename, text);
}, false);
function download(file, text) {
var element = document.createElement('a');
element.setAttribute('href', 'data:text/plain;charset=utf-8, ' + encodeURIComponent(text));
element.setAttribute('download', file);
document.body.appendChild(element);
//onClick property
element.click();
document.body.removeChild(element);
}
</script>
</body>
</html>
Sau khi nhấp vào biểu tượng tải xuống, chúng tôi có thể nhận được một tệp đã tải xuống ở định dạng tệp văn bản thuần túy.
Làm thế nào tôi có thể lấy dữ liệu từ khu vực văn bản?
Chúng ta có thể nhận được giá trị của textarea trong jQuery với phương thức trợ giúp của val ().Phương thức val () được sử dụng để lấy các giá trị từ các phần tử như textarea, input và select.with the help of val() method . The val() method is used to get the values from the elements such as textarea, input and select.
Làm thế nào tôi có thể nhận được giá trị textarea trong javascript?
Sử dụng thuộc tính giá trị để nhận giá trị của TextArea, ví dụ:const value = textarea.giá trị .Thuộc tính giá trị có thể được sử dụng để đọc và đặt giá trị của phần tử textarea.Nếu TextArea trống, một chuỗi trống được trả về., e.g. const value = textarea. value . The value property can be used to read and set the value of a textarea element. If the textarea is empty, an empty string is returned.
Chúng ta có thể sử dụng InnerHTML trong Textarea không?
Đối với div và span, bạn có thể sử dụng inNerHTML, nhưng đối với giá trị sử dụng textarea.for textarea use value.
Chúng ta có thể sử dụng thuộc tính giá trị trong Textarea không?
không hỗ trợ thuộc tính giá trị.does not support the value attribute. | 
