আমি যদি কোনও ইভেন্ট হ্যান্ডলারের সাথে বাঁধাই না করে বা ইতিমধ্যে ক্লিক না করে <a> লিঙ্কটি অনুসরণ করতে jquery ক্লিক () কল করতে পারি?

175

আমার জাভাস্ক্রিপ্টে আমার একটি টাইমার রয়েছে যা সময় শেষ হয়ে যাওয়ার পরে অন্য পৃষ্ঠায় যাওয়ার জন্য একটি লিঙ্কে ক্লিক করে অনুকরণ করতে হবে। এটি করার জন্য আমি jQuery এর click()ফাংশন ব্যবহার করছি । আমি ব্যবহার করেছি $().trigger()এবং window.locationএছাড়াও, এবং আমি এটি তিনটি সঙ্গে ইচ্ছানুসারে কাজ করতে পারেন।

আমি কিছু অদ্ভুত আচরণ পর্যবেক্ষণ করেছি click()এবং আমি কী হয় এবং কেন তা বোঝার চেষ্টা করছি।

আমি এই প্রশ্নে আমি যা বর্ণনা করি তার জন্য ফায়ারফক্স ব্যবহার করছি তবে অন্যান্য ব্রাউজারগুলি এর সাথে কী করবে সে সম্পর্কেও আমি আগ্রহী।

যদি আমি ব্যবহার না করে $('a').bind('click',fn)বা $('a').click(fn)কোনও ইভেন্ট হ্যান্ডলার সেট $('a').click()করতে না পারি , তবে কল করা কিছুতেই কিছু করবে না বলে মনে হচ্ছে। এটি এই ইভেন্টের জন্য ব্রাউজারের ডিফল্ট হ্যান্ডলারটিকে কল করে না, কারণ ব্রাউজারটি নতুন পৃষ্ঠা লোড করে না।

যাইহোক, যদি আমি প্রথমে কোনও ইভেন্ট হ্যান্ডলার সেট করি তবে এটি ইভেন্ট হ্যান্ডলার কিছুই না করলেও এটি প্রত্যাশা অনুযায়ী কাজ করে।

$('a').click(function(){return true;}).click();

এটি নতুন পৃষ্ঠাটিকে এমনভাবে লোড করে যেন আমি নিজেই ক্লিক করেছিলাম।

সুতরাং আমার প্রশ্ন দ্বিগুণ: আমি কোথাও কিছু ভুল করছি বলে এই অদ্ভুত আচরণ কি? এবং click()যদি আমি নিজের কোনও হ্যান্ডলার তৈরি না করি কেন কলিং ডিফল্ট আচরণের সাথে কিছুই করে না?

সম্পাদনা করুন:

হফম্যান যখন নির্ধারিত হয়েছিল যে তিনি যখন আমার ফলাফলগুলি নকল করার চেষ্টা করেছিলেন, আমি উপরে বর্ণিত ফলাফলটি আসলে ঘটে না। গতকাল আমি যে ঘটনাগুলি পর্যবেক্ষণ করেছি তার কারণ সম্পর্কে আমি নিশ্চিত নই, তবে আমি আজ নিশ্চিত হয়েছি যে আমি প্রশ্নটিতে যা বর্ণনা করেছি তা তা নয়।

সুতরাং উত্তরটি হ'ল আপনি ব্রাউজারে "জাল" ক্লিক করতে পারবেন না এবং সমস্ত jQuery যা করে তা আপনার ইভেন্ট হ্যান্ডলারকে কল করে। আপনি window.locationপৃষ্ঠাটি পরিবর্তন করতে এখনও ব্যবহার করতে পারেন এবং এটি আমার পক্ষে ভাল কাজ করে।

— Mnebuerquo
সূত্র

2

হতে পারে একটি সমাধান: stackoverflow.com/questions/31687759/...

— Sukrit Chhabra

90

আকর্ষণীয়, এটি সম্ভবত jQuery এর জন্য একটি "বৈশিষ্ট্য অনুরোধ" (অর্থাত্ বাগ)। JQuery ক্লিক ইভেন্টটি যদি আপনি কোনও jQuery ইভেন্টকে উপাদানটিতে আবদ্ধ করেন তবে কেবলমাত্র উপাদানটিতে ক্লিক ক্রিয়াকলাপটি (DOM এ অনক্লিক ইভেন্ট নামে পরিচিত) ট্রিগার করে। আপনার jQuery মেলিং তালিকাগুলিতে যেতে হবে ( http://forum.jquery.com/ ) এবং এটি রিপোর্ট করুন। এটি হতে পারে পছন্দসই আচরণ, তবে আমি তা মনে করি না।

সম্পাদনা করুন:

আমি কিছু পরীক্ষা করেছি এবং আপনি যা বলেছিলেন তা ভুল, আপনি যদি কোনও 'একটি' ট্যাগে কোনও ফাংশন বেঁধে রাখেন তা এখনও আপনাকে href অ্যাট্রিবিউট দ্বারা নির্দিষ্ট করা ওয়েবসাইটে নিয়ে যায় না to নিম্নলিখিত কোড ব্যবহার করে দেখুন:

<html>
<head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
 <script>
  $(document).ready(function() {
   /* Try to dis-comment this:
   $('#a').click(function () {
    alert('jQuery.click()');
    return true;
   });
   */
  });
  function button_onClick() {
   $('#a').click();
  }
  function a_onClick() {
   alert('a_onClick');
  }
 </script>

</head>
<body>
 <input type="button" onclick="button_onClick()">
 <br>
 <a id='a' href='http://www.google.com' onClick="a_onClick()"> aaa </a>

</body>
</html>

আপনি লিঙ্কটিতে সরাসরি ক্লিক না করে (মন্তব্য করা কোড সহ বা ছাড়াই) এটি google.com এ যায় না .com এছাড়াও খেয়াল করুন যে আপনি ক্লিক ইভেন্টটিকে লিঙ্কটি বেঁধে রাখলেও এমনকি আপনি একবার বোতামটি ক্লিক করার পরে এটি বেগুনি রঙের হয় না। আপনি লিঙ্কটি সরাসরি ক্লিক করলে এটি বেগুনি হয়ে যায়।

আমি কিছু গবেষণা করেছি এবং দেখে মনে হচ্ছে যে .ক্লিকটি 'এ' ট্যাগগুলির সাথে কাজ করার কথা মনে করছেন না কারণ ব্রাউজার জাভাস্ক্রিপ্টের সাথে "জাল ক্লিক" সাপোর্ট করে না। মানে, আপনি জাভাস্ক্রিপ্ট সহ কোনও উপাদানকে "ক্লিক" করতে পারবেন না। 'একটি' ট্যাগের সাহায্যে আপনি এর অনক্লিক ইভেন্টটি ট্রিগার করতে পারেন তবে লিঙ্কটি রঙ পরিবর্তন করবে না (পরিদর্শন করা লিঙ্ক রঙের জন্য, বেশিরভাগ ব্রাউজারে ডিফল্টটি বেগুনি রঙের হয়)। সুতরাং $ () তৈরি করা কোনও অর্থবোধ করে না the

— হফম্যান
সূত্র

7

আমি আপনার কোডটি চেষ্টা করেছিলাম এবং আপনি যা বলেছিলেন ঠিক তেমনই এটি করে তবে আমার কোডটি আমি উপরে বর্ণিত হিসাবে করে। আমি আরও কিছু পরীক্ষা-নিরীক্ষা করব এবং আমার ফলাফলগুলির একটি সাধারণ উদাহরণ আমি একসাথে রাখতে পারছি যা আপনি চেষ্টা করতে পারেন see

— Mnebuerquo

1

ঠিক আছে. এটা অবশ্যই আমি ভুল করেছিলাম কিছু ছিল। আমি আমার প্রশ্নটি পোস্ট করার সময় একেবারে নিশ্চিত ছিলাম যে এটি কাজ করছে, তবে যেহেতু আমি আপনার উদাহরণটি চেষ্টা করেছি তা আমার আর কাজ করে না। পৃষ্ঠাটি পরিবর্তনের জন্য আমি কেবল উইন্ডো.লোকশন ব্যবহার করে ফিরে যাব এবং ক্লিকটি নকল করার চেষ্টা করব না।

— Mnebuerquo

প্রকৃতপক্ষে, ক্লিকটি (জাল ক্লিকগুলি তৈরি করার উদ্দেশ্যে নয়) তবে আমরা কখনও কখনও জাভাস্ক্রিপ্টের ইনজেকশনের সাহায্যে বোতাম বা ফর্মগুলি ক্লিক করতে বা কেবল বিদ্যমান জাভাস্ক্রিপ্ট ফাংশনগুলির উপরে একটি অস্থায়ী হটকি তৈরি করার সময় এটি ব্যবহার করতে পারি।

— অ্যারো ওয়াং

241

আরেকটি বিকল্প অবশ্যই ভ্যানিলা জাভাস্ক্রিপ্ট ব্যবহার করা অবশ্যই:

document.getElementById("a_link").click()

— পিটার
সূত্র

1

এটি সাফারিতে কাজ করে না, এবং এইচটিএমএল অনুমান অনুসারে কেবল ইনপুটগুলি এটি প্রয়োগ করতে পারে।

— জেরেমি কফম্যান

4

Dang! এটি কাজ করে! তবে আমি অবশ্যই বলব যে এটি কোনও "ভ্যানিলা" জাভাস্ক্রিপ্টটি যেহেতু এটি জ্যাকুরি উপাদান ব্যবহার করছে না, তাই এটি সাজানো-ভ্যানিলা জ্যাকুরি জাভাস্ক্রিপ্ট .... এটি ফায়ারফক্স 24 এবং আইই 10 তে কাজ করে

— বিজিএমকোডার

@ বিজিএম, ঠিক আছে, তবে ক্লিক () কোনও জেকারি উপাদানটিতে নেই। আপনি এটিকে এলিটমেন্ট বাইআইডি ("..") দ্বারা প্রতিস্থাপন করতে পারেন click ক্লিক করুন ()

— পিটার

বাহ আহত পূর্ণ, আমি প্রত্যাশা মত কাজ করে। +1 দেওয়া হয়েছে :)। অন্যান্য ব্যবহারকারীর জন্য আপনি ব্যবহার করতে পারেন: var lnk = document.getElementById ("a_link"); যদি (lnk == নাল) {// কিছু করুন ....} অন্য {lnk.click (); }

— ইকবাল

বিভিন্ন ব্রাউজারে পরীক্ষিত, IE10 এবং Jquery 1.6.4 এটি পরিচালনা করতে পারে না।

— হ্যানস স্নাইডারমায়ার

65

আপনি যদি $.clickফাংশনটির কোডটি দেখেন তবে আমি বাজি ধরব সেখানে একটি শর্তসাপেক্ষ বিবৃতি রয়েছে যা পরীক্ষা করার clickআগে উপাদানটির শ্রোতাদের রেজিস্ট্রেশন করেছে কিনা তা যাচাই করে । কেন কেবল hrefলিঙ্কটি থেকে বৈশিষ্ট্যটি পান এবং ম্যানুয়ালি পৃষ্ঠার অবস্থান পরিবর্তন করবেন না?

 window.location.href = $('a').attr('href');

সম্পাদনা: triggerফাংশনটি থেকে , সংস্করণ 1.3.2 এর jQuery উত্স থেকে এটি কেন ক্লিক করে না তা এখানে :

 // Handle triggering native .onfoo handlers (and on links since we don't call .click() for links)
    if ( (!elem[type] || (jQuery.nodeName(elem, 'a') && type == "click")) && elem["on"+type] && elem["on"+type].apply( elem, data ) === false )
        event.result = false;

    // Trigger the native events (except for clicks on links)
    if ( !bubbling && elem[type] && !event.isDefaultPrevented() && !(jQuery.nodeName(elem, 'a') && type == "click") ) {
        this.triggered = true;
        try {
            elem[ type ]();
        // prevent IE from throwing an error for some hidden elements
        } catch (e) {}
    }

এটি হ্যান্ডলারদের কল করার পরে (যদি থাকে তবে) jQuery বস্তুটিতে একটি ইভেন্ট ট্রিগার করে। তবে এটি কেবলমাত্র ইভেন্ট ইভেন্টের জন্য নেটিভ হ্যান্ডলারদের কল করে যদি উপাদানটি কোনও লিঙ্ক না থাকে। আমার ধারণা, এটি কোনও কারণে উদ্দেশ্যমূলকভাবে করা হয়েছিল। ইভেন্ট হ্যান্ডলারটি সংজ্ঞায়িত করা হয়েছে কিনা তা সত্য হওয়া উচিত, সুতরাং আপনার ইভেন্টে কোনও ইভেন্ট হ্যান্ডলার সংযুক্তি নেটিভ onClickহ্যান্ডলারকে কেন ডেকে আনল তা সম্পর্কে আমি নিশ্চিত নই । আমি যা করেছি তা করতে হবে এবং এটি কোথায় ডাকা হচ্ছে তা দেখতে মৃত্যুদন্ড কার্যকর করতে হবে।

— রায়ান লিঞ্চ
সূত্র

আমি প্রশ্নে উল্লিখিত হিসাবে আমি অবশ্যই উইন্ডো.লোকশন এবং হ্রেফ ব্যবহার করতে পারি। আমি jquery ক্লিক () এ কী ঘটে এবং আমি যে ফলাফলগুলি দেখেছি তার কারণগুলি বোঝার চেষ্টা করছি।

— মেনবুয়েরকো

আমি আমার উত্তরটি সম্পাদনা করেছি jQuery উত্সে এটি লিঙ্কগুলিতে c। ক্লিক () ক্লিক করে where

— রায়ান লিঞ্চ

2

উইন্ডো.লোকেশন কাজ করে, তবে HTTP রেফারার পোস্ট করে না, এবং পিছনের বোতামটি ভেঙে দেয়।

— চেজ সেয়বার্ট

5

অ্যাঙ্কর ট্যাগগুলিতে ক্লিক হ্যান্ডলারগুলি jQuery এর একটি বিশেষ কেস।

আমি মনে করি আপনি অ্যাঙ্কারের অনক্লিক ইভেন্টের (ব্রাউজার দ্বারা পরিচিত) এবং জিকুয়েরি অবজেক্টের ক্লিক ইভেন্টের মধ্যে বিভ্রান্ত হয়ে পড়ে যা অ্যাঙ্কর ট্যাগটির ডোমের ধারণাটি আবৃত করে।

আপনি এখানে jQuery 1.3.2 উত্স ডাউনলোড করতে পারেন ।

উত্সের প্রাসঙ্গিক বিভাগগুলি লাইনগুলি 2643-2645 (এটি বুঝতে সহজ করার জন্য আমি এটি একাধিক লাইনে বিভক্ত করেছি):

// Handle triggering native .onfoo handlers (and on links since we don't call .click() for links)
if (
     (!elem[type] || (jQuery.nodeName(elem, 'a') && type == "click")) && 
       elem["on"+type] && 
       elem["on"+type].apply( elem, data ) === false
   )
     event.result = false;

— marshally
সূত্র

5

জেএস / জিকুয়েরি "ক্লিক করা" লিঙ্কগুলির ডিফল্ট আচরণকে প্রোগ্রামগতভাবে সমর্থন করে না।

আপনি যা করতে পারেন তা হ'ল একটি ফর্ম তৈরি করে তা জমা দিন। এইভাবে আপনাকে ব্যবহার করতে হবে না window.locationবাwindow.open যা ব্রাউজারগুলির দ্বারা প্রায়শই অযাচিত পপআপ হিসাবে অবরুদ্ধ থাকে।

এই স্ক্রিপ্টটিতে 2 টি পৃথক পদ্ধতি রয়েছে: একটি যা 3 টি নতুন ট্যাব / উইন্ডো খোলার চেষ্টা করে (এটি আইআই এবং ক্রোমে কেবল 1 টি খোলে, নীচে আরও তথ্য) এবং লিঙ্ক ক্লিকে একটি কাস্টম ইভেন্টে আগুন জ্বালানো একটি।

এটি এখানে:

এইচটিএমএল

<html>
<head>
    <script src="jquery-1.9.1.min.js" type="text/javascript"></script>
    <script src="script.js" type="text/javascript"></script>
</head>
<body>
    <button id="testbtn">Test</button><br><br>

    <a href="https://google.nl">GOOGLE</a><br>
    <a href="http://en.wikipedia.org/wiki/Main_Page">WIKI</a><br>
    <a href="https://stackoverflow.com/">SO</a>
</body>
</html>

jQuery (স্ক্রিপ্ট.জেএস)

$(function()
{ 
    // Try to open all 3 links by pressing the button
    // - Firefox opens all 3 links
    // - Chrome only opens 1 of them without popup warning
    // - IE only opens 1 of them WITH popup warning
    $("#testbtn").on("click", function()
    {
        $("a").each(function()
        {
            var form = $("<form></form>");
            form.attr(
            {
                id     : "formform",
                action : $(this).attr("href"),
                method : "GET",
                // Open in new window/tab
                target : "_blank"
            });

            $("body").append(form);
            $("#formform").submit();
            $("#formform").remove();
        });
    });

    // Or click the link and fire a custom event 
    // (open your own window without following the link itself)
    $("a").on("click", function()
    {
        var form = $("<form></form>");
        form.attr(
        {
            id     : "formform",
            // The location given in the link itself
            action : $(this).attr("href"), 
            method : "GET",
            // Open in new window/tab
            target : "_blank"              
        });

        $("body").append(form);
        $("#formform").submit();
        $("#formform").remove();

        // Prevent the link from opening normally
        return false;
    });

});

এটি প্রতিটি লিঙ্ক উপাদানগুলির জন্য যা করে:

একটি ফর্ম তৈরি করুন
এটি গুণাবলী দিন
এটি ডিওমে যুক্ত করুন যাতে এটি জমা দেওয়া যায়
এটা দাখিল করো
সমস্ত ট্রেস অপসারণ করে ডিওএম থেকে ফর্মটি সরিয়ে ফেলুন * দুষ্ট হাসি sertোকান *

এখন আপনার কাছে একটি নতুন ট্যাব / উইন্ডো লোড হচ্ছে "https://google.nl"(বা যে কোনও ইউআরএল আপনি চান, কেবল এটি প্রতিস্থাপন করুন)। দুর্ভাগ্যক্রমে আপনি যখন এভাবে একাধিক উইন্ডো খোলার চেষ্টা করেন, Popup blockedতখন দ্বিতীয় বারটি খোলার চেষ্টা করার সময় আপনি একটি বার্তা বার পাবেন (প্রথমটি এখনও খোলা আছে)।

আমি এই পদ্ধতিতে কীভাবে পেলাম সে সম্পর্কে আরও তথ্য এখানে পাওয়া যায়:

window.openবা ব্যবহার না করেই নতুন উইন্ডো / ট্যাব খুলছেwindow.location.href

— রিচার্ড ডি উইট
সূত্র

3

হাইপারলিংক উপাদানটি ট্রিগার করুন যা উপাদানটির অভ্যন্তরে থাকে আপনি jquery হুকআপ করতে চান lick ক্লিক করুন ()

<div class="TopicControl">
    <div class="articleImage">
       <a href=""><img src="" alt=""></a>
    </div>
</div>

আপনার স্ক্রিপ্টে আপনি মূল ধারকটিতে হুকআপ করেন আপনি ক্লিক ইভেন্টটি চান। তারপরে আপনি উপাদানটি (টাইপ, শ্রেণি, আইডি) সন্ধানের জন্য স্ট্যান্ডার্ড জ্যাকোরি পদ্ধতিটি ব্যবহার করেন এবং ক্লিকটি ফায়ার করেন। যা ঘটে তা হ'ল জকিউরি ক্লিকটি ফায়ার জন্য একটি পুনরাবৃত্ত ফাংশনে প্রবেশ করে এবং আপনি ইভেন্ট 'ই' এবং স্টপপ্রপ্যাগেশন () ফাংশন গ্রহণ করে পুনরাবৃত্ত ফাংশনটি ভেঙে এবং মিথ্যা প্রত্যাবর্তন করেন কারণ আপনি jquery অন্য কিছু করতে চান না তবে লিঙ্কটি ফায়ার করেন।

$('.TopicControl').click(function (event) {
         $(this).find('a').click();
        event.stopPropagation();
        return false;
     });

বিকল্প সমাধানটি হ'ল উপাদানগুলিতে পাতাগুলি মোড়ানো এবং এর পরিবর্তে ভিতরে পাত্রে রাখুন place ডাব্লু 3 সি মানের সাথে সামঞ্জস্য করতে ব্লক প্রদর্শন করতে স্প্যানগুলি সেট করুন Set

— পল স্টাইলস
সূত্র

3

আপনি সেই উপাদানটির জন্য jQuery অবজেক্ট নির্বাচন করতে jQuery ব্যবহার করতে পারেন। তারপরে, অন্তর্নিহিত ডিওএম উপাদানটি পান এবং এটিকে কল করুনclick() পদ্ধতিটি ।

আইডি দ্বারা

$("#my-link").each(function (index) { $(this).get(0).click() });

অথবা সিএসএস ক্লাস দ্বারা সংযোগের লিঙ্কগুলিতে ক্লিক করতে jQuery ব্যবহার করুন

$(".my-link-class").each(function (index) { $(this).get(0).click() });

— 10GritSandpaper
সূত্র

2

এটি কিছুই করে না কারণ কোনও ইভেন্ট ইভেন্টের সাথে আবদ্ধ হয়নি। যদি আমি সঠিকভাবে স্মরণ করি তবে jQuery তার ইভেন্ট হ্যান্ডলারগুলির নিজস্ব তালিকা বজায় রাখে যা পারফরম্যান্স এবং অন্যান্য উদ্দেশ্যে নোডলিস্টে আবদ্ধ।

— JasonWyatt
সূত্র

2

আপনার যদি একটি কেস বা খুব কম ক্যাসের জন্য এই বৈশিষ্ট্যটি প্রয়োজন হয় need (আপনার পুরো অ্যাপ্লিকেশনটির জন্য এই বৈশিষ্ট্যটির প্রয়োজন নেই) আমি জিকুয়ারিটি বরং (অনেক কারণে নতুন সংস্করণে সিডিএন ইত্যাদিতে আপডেট করতে সক্ষম হওয়া সহ) ছেড়ে যাব এবং নীচের কাজটি করতে হবে:

// For modren Browsers
$(ele).trigger("click");

// Relaying on Paul Irish's conditional class names http://bit.ly/HWIpAp (via HTML5 Boilerplate http://bit.ly/HUzi3I) where each IE version gets a class of its Version
$("html.ie7").length && (function(){
    var eleOnClickattr = $(ele).attr("onclick") 
    eval(eleOnClickattr);
  })()

— adardesign
সূত্র

1

একই ট্যাবে হাইপারলিংক খুলতে, ব্যবহার করুন:

$(document).on('click', "a.classname", function() {
    var form = $("<form></form>");
    form.attr(
    {
        id     : "formid",
        action : $(this).attr("href"),
        method : "GET",
    });

    $("body").append(form);
    $("#formid").submit();
    $("#formid").remove();
    return false;
});

— ধর্মেন্দ্র সিংহ
সূত্র