এই jQuery ক্লিক ফাংশনটি কেন কাজ করছে না?

116

কোড:

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $("#clicker").click(function () {
        alert("Hello!");
        $(".hide_div").hide();
    });
</script>

উপরের কোডটি কাজ করে না। আমি যখন # ক্লিককারিতে ক্লিক করি তখন এটি সতর্ক হয় না এবং এটি লুকায় না। আমি কনসোলটি পরীক্ষা করেছি এবং আমার কোনও ত্রুটি নেই। জিকুয়েরি লোড হচ্ছে কিনা তাও আমি যাচাই করেছিলাম এবং প্রকৃতপক্ষে এটি। সুতরাং সমস্যাটি কী তা নিশ্চিত নয়। আমি একটি সতর্কতা সহ একটি দস্তাবেজ প্রস্তুত ফাংশনও করেছি এবং এটি কী ভুল করছি তা নিশ্চিতভাবে কাজ করে না। সাহায্য করুন. ধন্যবাদ!

— Starbucks
সূত্র

3

ডকুমেন্টে

— কোডটি মোড়ক করুন ready প্রস্তুতি

1

যদি কোনও ত্রুটি, বাক্য গঠন বা ফাইল না পাওয়া যায় বা অন্য কিছু থাকে তবে আপনি কি ব্রাউজারের কনসোলটি পরীক্ষা করেছেন?

— সিদ্ধার্থ পান্ডে

1

জিকিউয়ারি বা ডোম পদ্ধতি যেমন getElementById এর উপাদানটি কেন খুঁজে পাচ্ছে না এর

— ব্যবহারকারী4642212

180

আপনার একটি $(document).ready(function() {});ব্লকে জাভাস্ক্রিপ্ট কোড যুক্ত করার কথা ।

অর্থাত

$(document).ready(function() {
  $("#clicker").click(function () {
    alert("Hello!");
    $(".hide_div").hide();
  });
});

হিসাবে jQuery এর ডকুমেন্টেশন পদ বলে: প্রস্তুত jQuery এর তোমার জন্য প্রস্তুতি এই অবস্থা সনাক্ত করে "একজন পৃষ্ঠা খুঁজে নিরাপদে পর্যন্ত নথি কাজে ব্যবহৃত হতে পারে" "কোড ভিতরে অন্তর্ভুক্ত করা হয়েছে।। $( document ).ready()শুধুমাত্র একবার পৃষ্ঠা ডকুমেন্ট অবজেক্ট মডেল (করে DOM) চালানো হবে জাভাস্ক্রিপ্ট জন্য প্রস্তুত সম্পাদন করার কোড "

— mobius
সূত্র

7

আমার কেমন বোকা !! এখনো শিখছি. আমি ভেবেছিলাম যে আমি ক্লিক ফাংশনটির কোনওটির প্রয়োজন নেই যেহেতু এটি বনাম ডকুমেন্ট ক্লিক করতে সক্রিয় করা আছে ready যেখানে এটি পৃষ্ঠা লোডে লোড হয় ready

— স্টারবাকস

7

@ স্টারবাকস এ নিয়ে খুব বেশি চিন্তা করবেন না, সবাই ভুল করে এবং বিশেষত শেখার সময় :)

— মবিয়াস

4

ডকুমেন্ট রেডি ফাংশনটি শ্রোতাদের পৃষ্ঠায় যা সন্ধান করে তার ভিত্তিতে সেট আপ করে। আপনি যদি এটি না করেন তবে সেগুলি কখনও সেট আপ হয় না। এটি করার সর্বোত্তম উপায় হ'ল পরিবর্তে তাদের "অন ()" ফাংশন দিয়ে দেওয়া। লোডের পরে সেই পৃষ্ঠাতে যুক্ত হওয়া কোনও উপাদান এখনও কাজ করবে!

— শান কেন্ডেল

1

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

— শান কেন্ডল

2

@ সানকেন্ডেল - এটি কীভাবে .on()কাজ করে না । আপনি এটি ডেলিগ্রেটিড হ্যান্ডলারগুলি তৈরি করতে ব্যবহার করতে পারেন, তবে এটি কোনওভাবেই "পৃষ্ঠাটি স্ক্র্যাপ" করে না, এটি শ্রোতাদের যে jQuery অবজেক্টে আপনি কল করেছেন তাতে নির্দিষ্ট উপাদান (গুলি) এর সাথে আবদ্ধ করে।

— nnnnnn

65

আমি with (ডকুমেন্ট) দিয়ে অন ব্যবহার করে এই সমস্যার সর্বাধিক সমাধান খুঁজে পেয়েছি।

 $(document).on('click', '#yourid', function() { alert("hello"); });

আইডি শুরু করার জন্য নীচে দেখুন:

$(document).on('click', 'div[id^="start"]', function() {
alert ('hello'); });

অবশেষে 1 সপ্তাহ পরে আমার অনক্লিক ট্রিগার যুক্ত করার দরকার নেই। আমি আশা করি এটি অনেক লোককে সহায়তা করবে

— user5636597
সূত্র

2

আহ ধন্যবাদ, উপরেরটি আমার পক্ষে কাজ করে নি, তবে এটি করেছে! (সম্ভবত কিছু কৌণিক রাউটিং সঙ্গে অদ্ভুত পারস্পরিক আদানপ্রদান)

— Flink

ফ্লিংকের মতো, আমি এটি দিয়েও সমস্যার সমাধান করেছি। ধন্যবাদ .. 100 upvote ..

— জিটা 11

3

এটিকে প্রতিনিধি বলা হয় এবং গতিশীল

— icallyোকানো

এই আমার জন্য কাজ! ধন্যবাদ :)

— অমৃত পাল সিং

20

আপনার কোডটি ডকুমেন্ট ছাড়াই কাজ করতে পারে ready এই ডেমোটি চেকআউট করুন: http://jsbin.com/aPAsaZo/1/

রেডি কনসেপ্টে আইডিয়া। আপনি যদি নিশ্চিত হন যে আপনার স্ক্রিপ্টটি আপনার পৃষ্ঠার সর্বশেষতম জিনিস বা এটি প্রভাবিত উপাদানটির পরে রয়েছে তবে এটি কার্যকর হবে।

<!DOCTYPE html>
<html>
<head>


<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <script src="https://code.jquery.com/jquery-latest.min.js"
        type="text/javascript"></script>
  <a href="#" id="clicker" value="Click Me!" >Click Me</a>
  <script type="text/javascript">

        $("#clicker").click(function () {
            alert("Hello!");
            $(".hide_div").hide();

        });


</script>

</body>
</html>

বিজ্ঞপ্তি: ইনjsbinকোডটির httpসাথে ডেমো প্রতিস্থাপন করুন httpsবা এই রূপটি ডেমো ব্যবহার করুন

— SaidbakR
সূত্র

11

+1 - আপনার উত্তরটি ব্যাখ্যা করে যে একজনের কেন document.ready()ফাংশন প্রয়োজন।

— কেভিন

1

এটি একটি আরও ভাল উত্তর কারণ jquery স্ক্রিপ্ট অবশ্যই একটি 'ডকুমেন্ট.ডিয়ার ()' ফাংশনের মধ্যে থাকতে হবে তা বিভ্রান্তিকর। হ্যাঁ, এটি নিরাপদ তবে আপনি যদি ফ্লাইতে জেকারি ফাংশনের জন্য এইচটিএমএল উপাদানটি সেট আপ করেন (যেমন কী বোতামটি ক্লিক করা হয় তার উপর নির্ভর করে একটি টেবিল সারিটি জিজ্ঞাসা করুন), এটি ফাংশনের বাইরে / পরে থাকা দরকার। আমি আমার পপ-আপ ওভারলেগুলির জন্য লক্ষ্য ডিভের নামটি ভুল করে পরিবর্তন করেছি এবং তারপরে স্ক্রিপ্টের ত্রুটির জন্য বেশ কয়েকটি হতাশার সময় ব্যয় করেছি। বড় পাঠ শিখেছি।

— জনহোল্ডেন

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

— আন্দ্রে শিপিলভ

@ আন্ড্রেশিপিলভ কে বলেছেন যে, কেবল এই পৃষ্ঠার উত্সটি দেখুন এবং এর নীচে যান, আপনি সেখানে জাভাস্ক্রিপ্ট কোড দেখতে পাবেন।

— সৈয়দবাকআর

1

@ অ্যান্ড্রেশিপিলভ - আপনি কি জানেন যে এই সমস্যাটির সমাধানের জন্য কীভাবে ডিবাগ সরঞ্জামগুলি ব্যবহার করতে হয়? তারপরে দয়া করে অন্যদের আপত্তি জানানোর পরিবর্তে আপনার জ্ঞান ভাগ করুন। গঠনমূলক এবং সুষ্ঠু হওয়ার চেষ্টা করুন।

— ম্যাট

6

আপনার জাভাস্ক্রিপ্ট-কোডটি $(document).ready(function(){});এই জেএসফিডেলের সাথে লুকিয়ে রাখতে হবে ।

জেএস কোড:

$(document).ready(function() {

    $("#clicker").click(function () {
        alert("Hello!");
        $(".hide_div").hide();    
    });
});

— কুলাঙ্গার
সূত্র

5

$(document).ready(function(){আপনার স্ক্রিপ্টের শুরুতে এবং পরে যুক্ত করার চেষ্টা করুন });। এছাড়াও, এর divমধ্যে আইডি কি সঠিকভাবে আছে, অর্থাত্ একটি আইডি হিসাবে, কোনও শ্রেণি নয়?

— tjons
সূত্র

3

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

— vicgilbcn
সূত্র

বা, উদাহরণস্বরূপ, z- সূচক!

— একজন দারুণ

3

$(function(){ // code });যখন ডকুমেন্টটি ব্লকের ভিতরে কোডটি কার্যকর করতে প্রস্তুত হয় তখন আপনি মৃত্যুদন্ড কার্যকর করতে পারেন ।

$(function(){
    $('#clicker').click(function(){
        alert('hey');
        $('.hide_div').hide();
    });
});

— রকেশ কাদাদাস
সূত্র

2

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

— অভিনব সিং
সূত্র

সত্য, আমি ফ্লাস্ক / জিনজা ব্যবহার করছি এবং এটি এইচটিএমএল-তে অনক্লিক সম্পত্তি ব্যবহার না করে এবং সেখান থেকে আমার <script>

— রিচ স্টোন-