পাঠ্যবক্স ফোকাস হারানো অবধি jQuery টেক্সটবক্স পরিবর্তন ইভেন্ট আগুন না?

Question

আমি দেখতে পেয়েছি যে টেক্সটবক্সের বাইরে ক্লিক না করা পর্যন্ত টেক্সটবক্সে jQuery পরিবর্তন ইভেন্টটি আগুন দেয় না।

এইচটিএমএল:

<input type="text" id="textbox" />

জাতীয়:

$("#textbox").change(function() {alert("Change detected!");});

জেএসফিডেলে ডেমো দেখুন

আমার অ্যাপ্লিকেশনটির পাঠ্যবক্সের প্রতিটি চরিত্রের পরিবর্তনে ইভেন্টটি বরখাস্ত করা দরকার। আমি এমনকি পরিবর্তে কীআপ ব্যবহার করার চেষ্টা করেছি ...

$("#textbox").keyup(function() {alert("Keyup detected!");});

... তবে এটি একটি পরিচিত সত্য যে কী-আপ ইভেন্টটি ডান-ক্লিক-এবং-পেস্টে চালিত হয়নি।

কোন কাজ? উভয় শ্রোতার কি কোনও সমস্যা হতে চলেছে?

Comments

এই। আপনার পছন্দমতো ইভেন্ট হ্যান্ডলার থাকতে পারে।

— মনিকা সেলিও

Answer 1

উভয় ইভেন্টের সাথে বাঁধাই করা এটি করার সাধারণ উপায়। আপনি পেস্ট ইভেন্টেও আবদ্ধ থাকতে পারেন।

আপনি এর মতো একাধিক ইভেন্টের সাথে আবদ্ধ হতে পারেন:

$("#textbox").on('change keyup paste', function() {
    console.log('I am pretty sure the text box changed');
});

আপনি যদি এটি সম্পর্কে পেডেন্টিক হতে চান, তবে আপনার পাঠ্যটিকে চারপাশে টেনে আনার জন্য মাউসআপের সাথেও আবদ্ধ হওয়া উচিত এবং lastValueপাঠ্যটি আসলে পরিবর্তিত হয়েছে তা নিশ্চিত করার জন্য একটি ভেরিয়েবল যুক্ত করা উচিত:

var lastValue = '';
$("#textbox").on('change keyup paste mouseup', function() {
    if ($(this).val() != lastValue) {
        lastValue = $(this).val();
        console.log('The text box really changed this time');
    }
});

এবং আপনি যদি super duperপেডেন্টিক হতে চান তবে অটো ফিল, প্লাগিন ইত্যাদির জন্য আপনার একটি বিরতি টাইমার ব্যবহার করা উচিত:

var lastValue = '';
setInterval(function() {
    if ($("#textbox").val() != lastValue) {
        lastValue = $("#textbox").val();
        console.log('I am definitely sure the text box realy realy changed this time');
    }
}, 500);

Comments

শেষ পর্যন্ত কেউ প্রশ্নটি পড়ে পুরো বিষয়টি উত্তর দিলেন!

— ইনস্টল করুন মনিকা সেলিও

.on('change keyup paste', function() {...}আসলে একাধিকবার আগুন! যদি আমি একটি অক্ষর টাইপ করি এবং তারপরে বাইরে ক্লিক করি তবে 'পরিবর্তন' এবং 'কীআপ' ইভেন্টগুলি উভয়ই বরখাস্ত করা হয়, যার ফলে ফাংশনটি একাধিকবার কার্যকর করা যায়! যদি আমি ডান-ক্লিক-পেস্ট করে এবং তারপরে বাইরে ক্লিক করি তবে 'পরিবর্তন' এবং 'পেস্ট' উভয়ই বরখাস্ত করা হয়। হেক! Ctrl + V ব্যবহার করে পেস্ট করতে এবং তারপরে বাইরে ক্লিক করে এটি তিনবার জ্বলতে থাকে !!

— এসএনএজি

@ এসএনএজি হ্যাঁ, সুতরাং একইভাবে আপনার lastValueপরিবর্তনশীল ব্যবহার করে একটি চেক যুক্ত করা উচিত যা এটির পরিবর্তিত হয়েছে তা নিশ্চিত করতে।

— পেটাহ

+1 টি। তবে, এখানে 'পরিবর্তন' করতে বাধ্য? এটি আমার কাছে পরিষ্কার নয় যে এমন কেস কে হ্যান্ডেল করবে যা ইতিমধ্যে এটি পরিবর্তন (পরিবর্তন) চালানোর সময় হ্যান্ডেল করা হত না।

— ম্যাডব্রেকস

টেক্সটটি আসলে আটকানোর আগে পেস্ট ইভেন্টটি বহিস্কার করা হবে

— developerbmw

Answer 2

আধুনিক ব্রাউজারে, আপনি ব্যবহার করতে পারেন ঘটনা :input

ডেমো

$("#textbox").on('input',function() {alert("Change detected!");});

Comments

ভাল - আমি এটা সম্পর্কে অবগত ছিল না। এটি কি এইচটিএমএল 5 জিনিস?

— মনিকা সেলিও

আমি এই উত্তরটি মানতে পছন্দ করতাম তবে আপনি যেমন বলেছিলেন এটি আধুনিক ব্রাউজারগুলির জন্য একটি সমাধান। আমার ওয়েব অ্যাপ্লিকেশনটি এখনও IE8 ব্যবহার করা ব্যবহারকারীদের লক্ষ্যবস্তু করা হয়েছে এবং এটি IE8 তে কাজ করে না। :( আমি কী বলতে পারি .. :(

— এসএনএজি

উদাহরণস্বরূপ সমস্ত পাঠ্য নির্বাচন করুন এবং মুছে ফেলুন কীটি চাপুন

— jjxtra

Answer 3

$(this).bind('input propertychange', function() {
        //your code here
    });

এটি টাইপিং, পেস্ট, ডান ক্লিকের মাউস পেস্ট ইত্যাদির জন্য কাজ করে

Comments

এটি সর্বোত্তম সমাধানের মতো বলে মনে হচ্ছে কারণ আপনি যদি একটি সংখ্যার ক্ষেত্রের উপরের তীরটিকে আঘাত করার মতো কিছু করেন তবে এটি একাধিক ইভেন্টগুলিতে আগুন দেয় না।

— জাস্টিন

সহজ এবং দক্ষ সমাধান

— আব্দুলহামেদ

Answer 4

if you write anything in your textbox, the event gets fired.
code as follows :

এইচটিএমএল:

<input type="text" id="textbox" />

জাতীয়:

<script type="text/javascript">
  $(function () {
      $("#textbox").bind('input', function() {
      alert("letter entered");
      });
   });
</script>

Answer 5

এটা চেষ্টা কর:

$("#textbox").bind('paste',function() {alert("Change detected!");});

জেএসফিডেলে ডেমো দেখুন ।

Comments

প্রশ্নটি পেস্ট করার কারণে এটি কাজ করে না। অনুষ্ঠানটি ডান-ক্লিক-এবং-পেস্ট-এ চালিত হয় না।

— ধাওয়াল মার্থক

এবং এর ব্যবহারের সাথে bind()কী করতে হবে ?

— মনিকা সেলিও

তিনি বলেছিলেন যে কীপ ইভেন্টটি যখন এটিতে রাইট ক্লিক ক্লিক করে তা বরখাস্ত করা হয় না, সুতরাং keyupএবং change()তাদের নিজস্ব আচরণগত আচরণ রয়েছে তাই তিনি ইভেন্টটি চালাতে চান তখন pasteবিকল্প হতে পারে

— ধাওয়াল মার্থক

অবশ্যই, তবে এটি তার bindপরিবর্তে কেন ব্যবহারের উত্তর দেয় না on।

— মনিকা সেলিও

Answer 6

নীচের কোডটি চেষ্টা করুন:

$("#textbox").on('change keypress paste', function() {
  console.log("Handler for .keypress() called.");
});

Comments

প্রশ্নটিতে উল্লিখিত হিসাবে মাউসটির সাথে ক্যাপচারটি কীভাবে আটকানো যায়?

— মনিকা সেলিও

event to be fired on every character change in the textbox

— কীপ্রেস

আপনি যদি সমস্ত প্রশ্নটি পড়তে চান তবে তিনি দেখতে পেয়েছেন যে,"...but it's a known fact that the keyup event isn't fired on right-click-and-paste."

— মোনিকা সেলিও

Answer 7

আপনার মন্তব্যগুলি পড়ার ফলে আমাকে একটি নোংরা সমাধানের দিকে নিয়ে যায়। এটি সঠিক উপায় নয়, আমি জানি, তবে এটি প্রায় কাজ হতে পারে।

$(function() {
    $( "#inputFieldId" ).autocomplete({
        source: function( event, ui ) {
            alert("do your functions here");
            return false;
        }
    });
});