আই.ই.তে পরিবর্তন () পরিবর্তন করতে jQuery প্রাপ্ত

Question

আমি যখন রেডিও বোতামের গ্রুপটি পরিবর্তন / ক্লিক করা হয় তখন উপাদানগুলি লুকিয়ে রাখতে এবং দেখানোর জন্য আমি jQuery ব্যবহার করছি। এটি ফায়ারফক্সের মতো ব্রাউজারগুলিতে দুর্দান্ত কাজ করে তবে IE 6 এবং 7 এ, ক্রিয়াটি তখনই ঘটে যখন ব্যবহারকারী তারপরে পৃষ্ঠায় অন্য কোথাও ক্লিক করেন।

বিস্তারিতভাবে বলতে গেলে, আপনি পৃষ্ঠাটি লোড করার সময়, সবকিছু ঠিকঠাক দেখাচ্ছে। ফায়ারফক্সে, আপনি যদি রেডিও বোতামটি ক্লিক করেন তবে একটি টেবিলের সারিটি গোপন করা হবে এবং অন্যটি অবিলম্বে প্রদর্শিত হবে। তবে, IE 6 এবং 7 এ আপনি রেডিও বোতামটি ক্লিক করেন এবং পৃষ্ঠায় কোথাও ক্লিক না করা পর্যন্ত কিছুই হবে না। তবেই IE প্রাসঙ্গিক উপাদানগুলি গোপন করে এবং প্রদর্শন করে পৃষ্ঠাটি পুনরায় আঁকেন।

আমি যে jQuery ব্যবহার করছি তা এখানে:

$(document).ready(function () {
  $(".hiddenOnLoad").hide();

  $("#viewByOrg").change(function () {
    $(".visibleOnLoad").show();
    $(".hiddenOnLoad").hide();
  });

  $("#viewByProduct").change(function () {
    $(".visibleOnLoad").hide();
    $(".hiddenOnLoad").show();
  });
});

এটি প্রভাবিত করে এমন এক্সএইচটিএমএলের অংশটি এখানে। পুরো পৃষ্ঠাটি এক্সএইচটিএমএল 1.0 স্ট্রাইক হিসাবে বৈধ হয়েছে।

<tr>
  <td>View by:</td>
  <td>
    <p>
      <input type="radio" name="viewBy" id="viewByOrg" value="organisation"
      checked="checked" />Organisation</p>
    <p>
      <input type="radio" name="viewBy" id="viewByProduct" value="product" />Product</p>
  </td>
</tr>
<tr class="visibleOnLoad">
  <td>Organisation:</td>
  <td>
    <select name="organisation" id="organisation" multiple="multiple" size="10">
      <option value="1">Option 1</option>
      <option value="2">Option 2</option>
    </select>
  </td>
</tr>
<tr class="hiddenOnLoad">
  <td>Product:</td>
  <td>
    <select name="product" id="product" multiple="multiple" size="10">
      <option value="1">Option 1</option>
      <option value="2">Option 2</option>
    </select>
  </td>
</tr>

কেন এমনটি ঘটছে এবং কীভাবে এটি ঠিক করবেন সে সম্পর্কে কারও যদি ধারণা থাকে তবে তাদের খুব প্রশংসা হবে!

Answer 1

এর .clickপরিবর্তে ব্যবহার করার চেষ্টা করুন .change।

Comments

@ সামজডসন, আমার পরীক্ষায় এটি সঠিক নয় এবং আমি তীর কীগুলি ব্যবহার করে পরবর্তী রেডিও বোতামটি নির্বাচন করলে জ্যাকুরির ক্লিকটি ট্রিগার করে। (ভিস্তা, ie7)

— সোভানড্রাগ্ট

@ প্যাসিফিকা: আই আই in এ আমার জন্য নয়। কমপক্ষে এটি অধিকার পায়। "ক্লিক" হ'ল "পরিবর্তন" থেকে একেবারে আলাদা ঘটনা এবং কমপক্ষে এমন কিছু কেস রয়েছে (যদি সমস্ত না হয়) যেখানে এটি একটি অনুচিত বিকল্প।

— ববি জ্যাক

@ সামজডসন: কীবোর্ডটি ব্যবহার করার সময় রেডিও বোতাম এবং চেকবক্সগুলিতে ইভেন্টগুলিতে ক্লিক করুন fire সমস্ত ব্রাউজারে কাজ করে

— ফিলিপ লেবার্ট

আমি সংশোধন করে দাঁড়িয়েছি - এটি কেস হিসাবে উপস্থিত বলে মনে হচ্ছে, তবে এটির মতবিরোধী হতে পারে!

— ববি জ্যাক

এটি এই নির্দিষ্ট প্রশ্নের সর্বাধিক জনপ্রিয় উত্তর বলে মনে হচ্ছে তবে এটি সম্পূর্ণ সঠিক নয়! clickথেকে পৃথক changeযে তার eventhandler যখন ইতিমধ্যেই নির্বাচিত বিকল্প ক্লিক যেহেতু বলা হবে changeনা। পুরানো এবং নতুন মানগুলির তুলনা করতে কীভাবে jQuery ব্যবহার করবেন তার একটি উদাহরণ এই উত্তরে রয়েছে .data।

— লাউজিন

Answer 2

clickপরিবর্তে ইভেন্টটি ব্যবহার করতে সমস্যা changeহ'ল একই রেডিও বাক্সটি নির্বাচিত হলে (যেমন বাস্তবে পরিবর্তন হয়নি) আপনি ইভেন্টটি পান। নতুন মানটি পুরানো চেয়ে আলাদা কিনা তা পরীক্ষা করে নিলে এটি ফিল্টার করা যায়। আমি এটি একটু বিরক্তিকর মনে।

আপনি যদি changeইভেন্টটি ব্যবহার করেন তবে আপনি খেয়াল করতে পারেন যে আপনি IE এর অন্য কোনও উপাদানটিতে ক্লিক করার পরে এটি পরিবর্তনটিকে স্বীকৃতি দেবে। আপনি যদি ইভেন্টটিতে কল blur()করেন তবে clickএটি changeইভেন্টটিকে আগুন ধরিয়ে দেবে (কেবলমাত্র রেডিও বাক্সগুলিতে কোনও পরিবর্তন হলে)।

আমি এখানে এটি কীভাবে করছি:

// This is the hack for IE
if ($.browser.msie) {
  $("#viewByOrg").click(function() {
    this.blur();
    this.focus();
  });
}

$("#viewByOrg").change(function() {
  // Do stuff here
});

এখন আপনি পরিবর্তন ইভেন্টটি স্বাভাবিকের মতো ব্যবহার করতে পারেন।

সম্পাদনা করুন: অ্যাক্সেসযোগ্যতার সমস্যাগুলি রোধ করতে ফোকাসে () ফোকাস করার জন্য একটি কল যুক্ত করা হয়েছে (নীচে ববির মন্তব্য দেখুন)।

Comments

এটি একটি খুব খারাপ হ্যাক, কারণ এটি আপনার ব্যবহারকারীদের কীবোর্ড ব্যবহার করে চলাচল করতে বাধা দেয়, কারণ রেডিও বোতামটি নির্বাচন করার পরে ফোকাস অদৃশ্য হয়ে যায়।

— ফিলিপ লেবাবার্ট

এটি দুর্দান্ত, তবে এটি কীবোর্ড অ্যাক্সেসিবিলিটি সমস্যা সৃষ্টি করে। অস্পষ্ট () ইভেন্টটি চালিয়ে যাওয়ার পরে, রেডিও বোতামটি আর ফোকাস করা হয় না, তাই কীবোর্ডের সাহায্যে রেডিও বোতামগুলির মধ্যে সরানো অত্যন্ত বিশ্রী হয়ে ওঠে। আমার বর্তমান সমাধানটি "এই.ফোকাস ()" এ একটি কল যুক্ত করা; অস্পষ্টতা () বিবৃতি পরে অবিলম্বে।

— ববি জ্যাক

অ্যাক্সেসিবিলিটি সমস্যার কারণে, এটি আমার কাছে উপস্থিত সবচেয়ে খারাপ সমাধান বলে মনে হয়।

— ফিলিপ লেবার্ট

তবে অ্যাক্সেসযোগ্যতার সমস্যাটি ফোকাস করার জন্য একটি কল দিয়ে সমাধান করা যেতে পারে ()। এটি কমপক্ষে প্রতিটি কিছুর জন্য ক্লিক () ব্যবহার করার মতো।

— ববি জ্যাক

ধন্যবাদ ববি, আমি এটি উত্তরে যুক্ত করব।

— মার্ক এ। নিকোলোসি

Answer 3

আপনি কি আইই-এর অন-প্রপার্টি চেঞ্জ ইভেন্টটি চেষ্টা করেছেন? আমি জানি না এটি কোনও পার্থক্য করে কিনা তবে সম্ভবত এটি চেষ্টা করার মতো। জেএস কোডের মাধ্যমে মানগুলি আপডেট করার সময় আইই পরিবর্তনের ইভেন্টটি ট্রিগার করে না তবে অনপ্রেটিটিচেঞ্জ এই পরিস্থিতিতে কাজ করবে।

$("#viewByOrg").bind($.browser.msie? 'propertychange': 'change', function(e) {
  e.preventDefault(); // Your code here 
}); 

Comments

"ক্লিক" কাজ করছে বলে মনে হচ্ছে না, তবে "সম্পত্তি পরিবর্তন" করেছে। ধন্যবাদ!

— জেমস কিংসবেরি

আমি এটি8 এ চেষ্টা করেছিলাম এটি কাজ করছে না। এটি ফাংশনের ভিতরে আসছে না ing

— ARUN

Answer 4

এটিও কাজ করা উচিত:

$(document).ready(function(){
   $(".hiddenOnLoad").hide();
   $("#viewByOrg, #viewByProduct").bind(($.browser.msie ? "click" : "change"), function () {
                        $(".visibleOnLoad").show();
                        $(".hiddenOnLoad").hide();
                    });
});

ধন্যবাদ পিয়র এটি খুব সহায়ক ছিল।

Comments

এটি সর্বনিম্ন গৃহীত / সর্বাধিক-ভোট প্রাপ্তের চেয়ে আরও ভাল উত্তর। এটি 'কেবল' আই-এর অধীনে কীবোর্ড অ্যাক্সেসিবিলিটি ভেঙে দেয়, সমস্ত ভাল ব্রাউজারের চেয়েও।

— ববি জ্যাক

... যদিও, এটি কেবল পিয়রের উত্তরের অনুলিপি নয়?

— ববি জ্যাক

সম্মত, এটি পিয়েরের সামান্য কম পাঠযোগ্য সংস্করণ তবে উভয় নির্বাচককে একটি কলে আবদ্ধ করা হয়েছে।

— ত্রিস্তান ওয়ার্নার-স্মিথ

কীবোর্ড সমর্থন যুক্ত করার clickসাথে প্রতিস্থাপন click keyup keypressকরুন।

— অ্যালোআইএসডিজি

Answer 5

আইইতে আপনাকে অবশ্যই ক্লিক ইভেন্টটি ব্যবহার করতে হবে, অন্য ব্রাউজারগুলিতে অন্বেষণ করতে হবে। আপনার ফাংশন হয়ে যেতে পারে

$(document).ready(function(){
   $(".hiddenOnLoad").hide();
   var evt = $.browser.msie ? "click" : "change";
   $("#viewByOrg").bind(evt, function () {
                        $(".visibleOnLoad").show();
                        $(".hiddenOnLoad").hide();
                    });

   $("#viewByProduct").bind(evt, function () {
                        $(".visibleOnLoad").hide();
                        $(".hiddenOnLoad").show();
                    });     
});

Comments

কীবোর্ড সমর্থন যুক্ত করার clickসাথে প্রতিস্থাপন click keyup keypressকরুন।

— অ্যালোআইএসডিজি

Answer 6

এই প্লাগইন যুক্ত করুন

jQuery.fn.radioChange = function(newFn){
    this.bind(jQuery.browser.msie? "click" : "change", newFn);
}

তারপর

$(function(){
    $("radioBtnSelector").radioChange(function(){
        //do stuff
    });
});

Answer 7

ইনপুট পাঠ্য নিয়ে আমার একই সমস্যা ছিল।

আমি বদলে গেছি:

$("#myinput").change(function() { "alert('I changed')" });

প্রতি

$("#myinput").attr("onChange", "alert('I changed')");

এবং আমার জন্য সবকিছু ঠিকঠাক কাজ করছে!

Answer 8

উপাদানটি ক্লিক করা হয় তখন পরিবর্তনের ইভেন্টটি ফায়ার করতে IE কে বলার একটি সহজ উপায়:

if($.browser.msie) {
    $("#viewByOrg").click(function() {
        $(this).change();
    });
}

আপনি আরও ফর্ম উপাদানগুলির সাথে কাজ করার জন্য আরও সাধারণ কিছুতে এটি প্রসারিত করতে পারেন:

if($.browser.msie) {
    $("input, select").click(function() {
        $(this).change();
    });
    $("input, textarea").keyup(function() {
        $(this).change();
    });
}

Answer 9

আমি নিশ্চিত যে এটি আইইয়ের একটি পরিচিত সমস্যা। onclickইভেন্টটির জন্য কোনও হ্যান্ডলার যুক্ত করা সমস্যার সমাধান করা উচিত:

$(document).ready(function(){

    $(".hiddenOnLoad").hide();

    $("#viewByOrg").change(function () {
        $(".visibleOnLoad").show();
        $(".hiddenOnLoad").hide();
    });

    $("#viewByOrg").click(function () {
        $(".visibleOnLoad").show();
        $(".hiddenOnLoad").hide();
    });

    $("#viewByProduct").change(function () {
        $(".visibleOnLoad").hide();
        $(".hiddenOnLoad").show();
    });     

    $("#viewByProduct").click(function () {
        $(".visibleOnLoad").hide();
        $(".hiddenOnLoad").show();
    });     
});

Answer 10

আইই তে, রেডিও এবং চেকবক্সগুলিকে "পরিবর্তন" ইভেন্টটি ট্রিগার করতে বাধ্য করুন:

if($.browser.msie && $.browser.version < 8)
  $('input[type=radio],[type=checkbox]').live('click', function(){
    $(this).trigger('change');
  });

Answer 11

jquery 1.6 হিসাবে এটি আর কোনও সমস্যা নেই .. নিশ্চিত হওয়া যায় না কখন এটি স্থির হয়েছিল .. যদিও godশ্বরের ধন্যবাদ যদিও এর জন্য

Answer 12

আপনি যদি আপনার jQuery সংস্করণটি 1.5.1 এ পরিবর্তন করেন তবে আপনাকে আপনার কোডটি সামঞ্জস্য করতে হবে না। তারপরে আই 99 শুনতে কেবল নিখুঁত:

$(SELECTOR).change(function() {
    // Shizzle
});

http://code.jquery.com/jquery-1.5.1.min.js

Answer 13

ক্লিকটির কৌশলটি কাজ করে ... তবে আপনি যদি রেডিও বা চেকবক্সের সঠিক অবস্থা পেতে চান তবে আপনি এটি ব্যবহার করতে পারেন:

(function($) {
    $('input[type=checkbox], input[type=radio]').live('click', function() {
       var $this = $(this);
       setTimeout(function() {
          $this.trigger('changeIE'); 
       }, 10) 
    });
})(jQuery);

$(selector).bind($.browser.msie && $.browser.version <= 8 ? 'changeIE' : 'change', function() {
  // do whatever you want
})

Answer 14

ইমো পরিবর্তনের পরিবর্তে ক্লিক ব্যবহার করে অর্থাত্‍ আচরণটি আলাদা হয়ে যায়। আমি পরিবর্তে একটি টাইমার (সেটটাইমআউট) ব্যবহার করে ইভেন্ট ইভেন্ট আচরণ অনুকরণ করব।

এর মতো কিছু (সতর্কতা - নোটপ্যাড কোড):

if ($.browser.msie) {
  var interval = 50;
  var changeHack = 'change-hac';
  var select = $("#viewByOrg");
  select.data(changeHack) = select.val();
  var checkVal=function() {
    var oldVal = select.data(changeHack);
    var newVal = select.val();
    if (oldVal !== newVal) {
      select.data(changeHack, newVal);
      select.trigger('change')
    }
    setTimeout(changeHack, interval);
  }
  setTimeout(changeHack, interval);
}

$("#viewByOrg").change(function() {
  // Do stuff here
});

Comments

হুহ ... একটু ভারী হাতে, না?

— orip

Answer 15

এটি চেষ্টা করুন, এটা আমার জন্য কাজ করে

$("#viewByOrg")
        .attr('onChange', $.browser.msie ? "$(this).data('onChange').apply(this)" : "")
        .change( function(){if(!$.browser.msie)$(this).data('onChange').apply(this)} )
        .data('onChange',function(){alert('put your codes here')});

Answer 16

এটি কাউকে সহায়তা করতে পারে: ফর্মের আইডি দিয়ে শুরু করার পরিবর্তে নির্বাচিত আইডিটিকে টার্গেট করুন এবং পরিবর্তনের সময় ফর্মটি জমা দিন:

<form id='filterIt' action='' method='post'>
  <select id='val' name='val'>
    <option value='1'>One</option>
    <option value='2'>Two</option>
    <option value='6'>Six</option>
  </select>
  <input type="submit" value="go" />
</form>

এবং jQuery:

$('#val').change(function(){
  $('#filterIt').submit();
});

(স্পষ্টতই, জাভাস্ক্রিপ্ট অক্ষম থাকলে সাবমিট বাটন alচ্ছিক)

Answer 17

নিম্নলিখিত চেষ্টা করুন:

.bind($.browser.msie ? 'click' : 'change', function(event) {

Answer 18

ব্যবহার করবেন না .focus () বা .select () সামনে .change () ফাংশন jQuery ইন্টারনেট জন্য, তাহলে এটি কাজ করে জরিমানা, IM আমার সাইট এটি ব্যবহার করে।

ধন্যবাদ

Answer 19

//global
var prev_value = ""; 

$(document).ready(function () {

 if (jQuery.browser.msie && $.browser.version < 8)
      $('input:not(:submit):not(:button):not(:hidden), select, textarea').bind("focus", function () { 
         prev_value = $(this).val();

       }).bind("blur", function () { 
         if($(this).val() != prev_value)
         has_changes = true;
       });
}

Answer 20

দয়া করে পরিবর্তন / ক্লিকের পরিবর্তে প্রতিটি ব্যবহার করে চেষ্টা করুন , যা প্রথমবারের মতো IE এবং অন্যান্য ব্রাউজারগুলিতেও দুর্দান্ত কাজ করছে

প্রথমবার কাজ করছেন না

$("#checkboxid").**change**(function () {

});

এমনকি প্রথমবার ঠিকঠাক কাজ করা

$("#checkboxid").**each**(function () {

});