JQuery এ, আমি কীভাবে একটি প্রোগ্রাম্যাটিক এবং ব্যবহারকারী ক্লিকের মধ্যে বলতে পারি?


91

বলুন আমার কাছে একটি ক্লিক হ্যান্ডলার সংজ্ঞায়িত আছে:

$("#foo").click(function(e){

});

ফাংশন হ্যান্ডলারের মধ্যে আমি কীভাবে বলতে পারি যে অনুষ্ঠানটি প্রোগ্রামিকভাবে চালিত হয়েছে, বা ব্যবহারকারী দ্বারা?


প্রোগ্রামটি প্রোগ্রামিয়ালি কোনও ইভেন্টের গুলি চালানো সম্পর্কে কীভাবে যায়?
ক্লেটন

4
আপনার কেসগুলি আলাদা করার দরকার কী?
দামিয়েন_এ_বিশ্বাসীরা

@ ক্লেটন: $x.click()বা $x.trigger('click')
মিউ খুব ছোট

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

4
এটি সর্বশেষতম ফায়ারফক্স, ক্রোম এবং আইই 9 তে কাজ করে। নীচের উত্তরটি কেন সর্বোচ্চ ভোট দিয়ে গ্রহণ করবেন না ?? @ কেভিনো
ওজজিআইইই

উত্তর:


120

আপনি ইভেন্ট অবজেক্টে একবার দেখে নিতে পারেন e। তাহলে ঘটনা একটি বাস্তব ক্লিকের দ্বারা আলোড়ন সৃষ্টি করা হলো, তুমি ভীষণ পছন্দ হবে clientX, clientY, pageX, pageY, ইত্যাদি ভিতরে eএবং তারা সংখ্যায় হবে; ক্লিকগুলি ট্রিগার করা হলে এই সংখ্যাগুলি মাউস পজিশনের সাথে সম্পর্কিত তবে কীবোর্ডের মাধ্যমে ক্লিকটি শুরু করা হলেও তারা সম্ভবত উপস্থিত থাকবে। যদি ইভেন্টটি এর পরে ট্রিগার করা হয়ে থাকে $x.click()তবে আপনার মধ্যে স্বাভাবিক অবস্থানের মান থাকবে না e। আপনি originalEventসম্পত্তিটির দিকেও নজর রাখতে পারেন, ঘটনাটি যদি আসে তবে সেখানে থাকা উচিত নয় $x.click()

এরকম কিছু হতে পারে:

$("#foo").click(function(e){
    if(e.hasOwnProperty('originalEvent'))
        // Probably a real click.
    else
        // Probably a fake click.
});

এবং এখানে খেলতে এখানে একটি সামান্য স্যান্ডবক্স: http://jsfiddle.net/UtzND/


4
এটি দুর্দান্ত ... আমি কেবল নিজের কাছে ভেবেছিলাম "সম্ভবত jQuery ট্রিগার ইভেন্টগুলিতে মাউসের অবস্থানের তথ্য নেই"! w00t!
কাসাপো

4
এটি ব্রাউজারগুলিতে পরাজিত হতে পারে যা ক্রিয়েভেন্টকে সমর্থন করে। jsfiddle.net/UtzND/26
জো এনজমিনগার

4
@ জোইনজমিনগার হ্যাঁ তবে আপনি কেন নিজের স্ক্রিপ্টকে পরাজিত করবেন তাই কথা বলার জন্য?
ওজজিআইই

4
আমি কোনও তৃতীয় পক্ষের স্ক্রিপ্ট সম্পর্কে একটি ক্লিক ইভেন্ট উত্পন্ন করার বিষয়ে উদ্বিগ্ন এবং আমার স্ক্রিপ্ট এটি ব্যবহারকারীর দ্বারা উত্পাদিত হয়েছিল (এমন একটি বাস্তব ক্লিক) the
জো এনজমিনগার

4
@ জোইনজমিনগার: আপনার কোডটি ব্রাউজারে আসার পরে সমস্ত বেট বন্ধ হয়ে যায়, যথেষ্ট চালাক ব্যক্তি পরাস্ত করতে পারবেন না এমন কিছুই করতে পারবেন না। আমার মনে হয় আপনি যা করতে পারেন তা হ'ল একগুচ্ছ জিনিস পরীক্ষা করা: কোনও কি আছে originalEvent? এটি কি সঠিক ধরণের জিনিস? কোথাও সমন্বয় আছে? স্থানাঙ্কগুলি কি সামঞ্জস্যপূর্ণ? স্থানাঙ্কগুলি কি ভিতরে আছে #foo? ...
মিউ খুব ছোট

44

JQuery ট্রিগার ম্যানুয়ালটিতে বর্ণিত হিসাবে আপনি একটি অতিরিক্ত প্যারামিটার ব্যবহার করতে পারেন :

$("#foo").click(function(e, from){
    if (from == null)
        from = 'User';
    // rest of your code
});

$('#foo').trigger('click', ['Trigger']);

4
আমি কেবল এটিই দেখতে পাচ্ছি সমস্যাটি হ'ল আপনি সাধারণ ক্লিকের মধ্যে পার্থক্য করতে পারবেন না এবং $x.click(), .click()কলকারীকে স্পষ্টভাবে আপনাকে বলতে হবে যে তারা এটি নকল করছে। কেভিন ওওকি কী করবেন তার উপর নির্ভর করে এটি কোনও সমস্যা হতে পারে বা নাও পারে।
মিউ খুব ছোট

4
@ মিমু: আমি "সাধারণ" ক্লিক (ব্যবহারকারী?) এবং ইভেন্ট $x.click()হ্যান্ডলার (ব্যবহারকারী ক্লিকের জন্য, যা "সাধারণ" হতে পারে ) এর মধ্যে আপনার পার্থক্যটি পুরোপুরি বুঝতে পারি না
শিকিরিউ

4
পার্থক্যটি হ'ল এটি ব্যবহারকারী থেকে আসে তবে অন্যটি সফ্টওয়্যার থেকে আসে। জাল ক্লিকটি একটি প্লাগইন বা অন্য কোনও কোড থেকে আসছে যা অতিরিক্ত যুক্তি যুক্ত করতে সংশোধন করা যায় না। আমি আপনার সমাধানটির সমালোচনা করছি না, কেবল কয়েকটি সম্ভাব্য গর্তগুলি লক্ষ্য করছি।
মিউ খুব ছোট

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

9

ইতিমধ্যে আরও একটি প্রশ্নের উত্তর দেওয়া আছে।

ক্লিক () কোনও মাউস ক্লিক হয় বা কোনও কোড দ্বারা ট্রিগার করা হয় তা কীভাবে সনাক্ত করবেন?

whichইভেন্ট অবজেক্টের সম্পত্তি ব্যবহার করুন । এটি undefinedকোড-ট্রিগার ইভেন্টগুলির জন্য হওয়া উচিত

$("#someElem").click(function(e) {
    if (e.which) {
        // Actually clicked
    } else {
        // Triggered by code
    }
});

জেএসফিডাল উদাহরণ - http://jsfiddle.net/interdream/frw8j/

আশা করি এটা সাহায্য করবে!


4
সবসময় কাজ করে না। যেমন একটি আসল ইভেন্টের জন্য এমনকি selectএকটি দিতে হবে e.which==undefined
জেএনএফ

5

আমি উপরের সমস্ত সমাধান চেষ্টা করেছি। আমার ক্ষেত্রে কিছুই কার্যকর হয়নি। সমাধান নীচে আমার জন্য কাজ করে। আশা করি এটি আপনাকেও সহায়তা করবে।

$(document).ready(function(){
  //calling click event programmatically
    $("#chk1").trigger("click");
});

$(document).on('click','input[type=checkbox]',function(e) {
		if(e.originalEvent.isTrusted==true){
			alert("human click");
		}
		else{
			alert("programmatically click");
		}
    
    });
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js">
</script>

<input type="checkbox" id="chk1" name="chk1" >Chk1</input>
<input type="checkbox" id="chk2" name="chk2" >Chk2</input>
<input type="checkbox" id="chk3" name="chk3" >Chk3</input>


4

ডোম স্তর 3 ইভেন্টটি উল্লেখ করে T এটি বর্তমানে IE9 + এবং ফায়ারফক্সে সমর্থিত (আমার পরীক্ষার উপর ভিত্তি করে। আমি এটিও পড়েছি (যদিও পুরোপুরি গবেষণা করা হয়নি) এটি কিছু ব্রাউজারে ওভাররাইড করা যেতে পারে এবং সম্ভবত এখনও বিশ্বস্ত হওয়ার জন্য 100% প্রস্তুত নয় (দুর্ভাগ্যক্রমে)।

এটি @ মিউ এর ফিডলের একটি পরিবর্তিত সংস্করণ যা আইই এবং ফায়ারফক্সে কাজ করে।


ভাল যুক্তি. আমি মনে করি না যদিও কিছু 100% শক্ত হতে চলেছে। isTrustedসমর্থিত এবং লিখিতযোগ্য নয় কিনা তা দেখতে আপনাকে কয়েকটি পরীক্ষায় মিশ্রিত করতে হবে। আমি মনে করি আসল উত্তরটি কেন এই প্রশ্নের পিছনে রয়েছে এবং আমরা কখনই তা খুঁজে পাইনি on
মিউ খুব ছোট

@ মিমু, আমি অনুরূপ জিজ্ঞাসা করার পরে এই প্রশ্নে এসেছি তবে আরও সাধারণ একটি। আমার "কেন" কেসটি হ'ল আমি নিশ্চিত করতে চাই যে আমি যদি কোনও পৃষ্ঠায় সরাসরি স্বীকৃত পদক্ষেপ গ্রহণ করি তবে আমি কেবলমাত্র একটি ক্রিয়া করছি (একটি আর্থিক লেনদেন, যদিও একটি ক্ষুদ্রতর হলেও) performing
জো এনজমিনগার

1

ভ্যানিলা জেএস সমাধান:

document.querySelector('button').addEventListener('click', function (e){
    if(e.isTrusted){
        // real click.
    }else{
        // programmatic click
    }
});

-1

বৌদ্ধিক আলোচনায় অংশ নিতে যাচ্ছি না, কোডটি ফিল্টার করার জন্য আমার পক্ষে কাজ করেছে .click()এবং তা .trigger('click')হচ্ছে-

$(document).on('click touchstart', '#my_target', function(e) {
    if (e.pageX && e.pageY) { // To check if it is not triggered by .click() or .trigger('click')
        //Then code goes here
    }
});
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.