نمایش متنی که در حین اجرای برنامه تغییر کرده!

[desatir7316]

سلام دوستان
با استفاده از این پلاگین (http://madapaja.github.io/jquery.selection/) ، متن انتخاب شده از یک textarea رو تغییر دادم، حالا وقتی می خوام همین متن رو با console.log نشون بدم، همون متن اولی رو میاره و تغییرات رو نشون نمی ده


کد:

<script>
$(document).ready(function () {
$('body').delegate('#tag', 'click', function(e){
e.preventDefault();
text = $('#text');
console.log(text.text());
if (parseInt(text.selection().length, 10) != 0) {
$('#text').selection('insert', {
'text': '{{%',
'mode': 'before',
});
$('#text').selection('insert', {
'text': '}}',
'mode': 'after',
});

}

});

});
</script>




کد:

<textarea name="text" id="text" rows="10" cols="50">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium ad aliquam aliquid animi, aut deleniti fugit ipsam laboriosam omnis, perferendis quibusdam quo reiciendis repellendus reprehenderit saepe sint soluta temporibus voluptatibus.</textarea>




ممنون می شم راهنمایی کنید.

[frednasri]

سلام.

شما تو html موردی با id = tag ندارید که روش کلیک بشه. برای این، من اول یه دکمه با این id بعد از textarea ساختم:


<button id = "tag">Display the selected text</button>

بعد، خط 6 کد شما رو به کد زیر تغییر دادم:

console.log(text.selection());

حالا با انتخاب یه قسمت از متن، فقط اون قسمت توی کنسول نشون داده میشه.

امیدوارم این همونی باشه که می خواستید.

موفق باشید.

[desatir7316]

دکمه هست، اینجا کدهای اصلی رو گذاشته بودم
برنامه رو خودتون تست کردید؟ وقتی با استفاده از اون کتابخونه متن رو تغییر میدی، بعد می خوای کل متن رو توی کنسول نشون بدی، تغییرات رو برای شما نشون می ده؟

[frednasri]

بله من با همون پلاگین امتحان کردم.

طبق اون تغییراتی که من دادم (که خودتون می تونید امتحان کنید)، با کد زیر که به جای کد خط 6 شما میاد، می تونید متن انتخاب شده رو بعد از کلیک روی دکمه توی کنسول ببینید:

console.log(text.selection());

این دقیقاً همون کاریه که اسم پلاگین هم هست؛ یعنی با انتخاب متن مورد نظر (selection) اون رو نشون می ده.

حالا اگه شما می خواین کل محتوای متن رو (بعد از تغییر یا قبل از تغییر) نشون بدین، این ربطی به پلاگین نداره و فقط باید کد زیر رو اضافه کنید:

console.log(text.val());

البته اگه می خواین محتوای متن رو بعد از تغیر نشون بده، باید کد بالا رو در خط 18 کد خودتون بذارید (یعنی بعد از اعمال تغییرات توسط کد های پلاگین).

موفق باشید.