ট্রিগার পরিবর্তন ইভেন্ট <সিলেক্ট করুন> jquery ব্যবহার করে


145

যেভাবেই হোক আমি পৃষ্ঠা লোডের নির্বাচিত বাক্সে একটি পরিবর্তন ইভেন্টটি ট্রিগার করতে এবং একটি নির্দিষ্ট বিকল্প নির্বাচন করতে পারি।

এছাড়াও ফাংশনটিকে ইভেন্টে আবদ্ধ করার পরে ট্রিগার যুক্ত করে ফাংশনটি কার্যকর করা হয়।

আমি আউটপুট কিছু করার চেষ্টা ছিল এই

<select class="check">
<option value="one">one</option>
<option value="two">two</option>
</select>

$(function(){
    $('.check').trigger('change'); //This event will fire the change event. 
    $('.check').change(function(){
      var data= $(this).val();
      alert(data);            
    });
});

http://jsfiddle.net/v7QWd/1/


আপনি কি লোডের উপর একটি নির্দিষ্ট বিকল্প সেট করতে চান? বা আপনার পরিবর্তন ইভেন্টটি ট্রিগার করতে চান?
মানসে

আপনি চূড়ান্ত সমাধান প্রসারিত করতে পারে। পৃষ্ঠাটি লোড হওয়ার সময় আপনি কি কোনও বিকল্প চাপ দেওয়ার চেষ্টা করছেন, বা নির্দিষ্ট কিছু নির্বাচন করা হলে কোনও আলাদা বিকল্প নির্বাচন করছেন?
ম্যাথু রিখস

হাই, আপনার প্রতিক্রিয়ার জন্য ধন্যবাদ আমি সমস্যাটি সমাধান করতে সক্ষম হয়েছি এবং এটি নথিভুক্ত করেছি।
কিশনিও

উত্তর:


287

ব্যবহারের val()পরিবর্তন করতে মান (না পাঠ্য) এবং trigger()নিজে ঘটনা আগুনে।

ট্রিগারটির আগে পরিবর্তন ইভেন্ট হ্যান্ডলারটি অবশ্যই ঘোষণা করতে হবে।

এখানে একটি নমুনা

$('.check').change(function(){
  var data= $(this).val();
  alert(data);            
});

$('.check')
    .val('two')
    .trigger('change');

এছাড়াও বিকল্প পরিবর্তন করার পরে আমি পরিবর্তন ইভেন্ট ফাংশনটি কার্যকর করতে চেয়েছিলাম। wrt এই । সতর্কতা বাক্স কার্যকর করা উচিত।
কিশনিও

@ কিশনথোবহানিকে হ্যান্ডলার যুক্ত করার পরে আপনার এটি কল করা উচিত । নমুনা দেখুন।
জোসেফ

7
এই সমাধানের গুরুত্বপূর্ণ অংশটি হ'ল: পরিবর্তনের ইভেন্ট হ্যান্ডলারটিকে ট্রিগারের আগে ঘোষিত করা উচিত (বুদ্ধিমান ...), আমার ক্ষেত্রে সমস্যাটি ছিল, ধন্যবাদ!
লার্জান

এটি উদ্ধারক হিসাবে সহায়তা করেছে, আপনাকে ধন্যবাদ জোসেফ
দিব্যা

আপনি ব্যবহার করছেন আগে সংজ্ঞায়িত পরিবর্তন ফাংশন, আমার সমস্যা সমাধান করুন। ধন্যবাদ।
কমলেশ 25'19

27

কোনও বিকল্প নির্বাচন করতে, নির্বাচন .val('value-of-the-option')করুন উপাদানটিতে ব্যবহার করুন। পরিবর্তনের উপাদানটি ট্রিগার করতে, .change()বা ব্যবহার করুন .trigger('change')

আপনার কোডের সমস্যাগুলি হ'ল ডট ইন এর পরিবর্তে কমা $('.check'),trigger('change');এবং ঘটনা হ্যান্ডলারকে বাঁধার আগে আপনি এটি কল করেছেন।


10
$('#edit_user_details').find('select').trigger('change');

এটি এর সাথে নির্বাচিত এইচটিএমএল ট্যাগ ড্রপ-ডাউন আইটেমটি পরিবর্তন করবে id="edit_user_details"


6

যারা jQuery ট্রিগার হ্যান্ডলার দ্বারা অবরুদ্ধ ছিল তাদের জন্য আরেকটি কার্যকরী সমাধান, নেটিভ ইভেন্টগুলিতে দোসর আগুন নীচের মতো হবে (100% কার্যকারী):

var sortBySelect = document.querySelector("select.your-class"); 
sortBySelect.value = "new value"; 
sortBySelect.dispatchEvent(new Event("change"));

1
আমি উপরোক্ত সমস্ত চেষ্টা করেছি, তবে কেবলমাত্র এটিই আমার পক্ষে কাজ করে। আমার মনে হয়, কারণ আমার সিলেক্টটি প্রচুর পরিমাণে ছিল। ধন্যবাদ @ মোহাম্মদ 23 ঘারবি!
টিলিটো

1
একই অবস্থা. এই সমাধানটি আমি এক ঘন্টার জন্য সন্ধান করছি। ধন্যবাদ।
এমবারনা

1
এর উত্তর হওয়া দরকার!
MARS

1

বিকল্প ট্যাগটির লিঙ্কগুলি দিন

<select size="1" name="links" onchange="window.location.href=this.value;">
   <option value="http://www.google.com">Google</option>
   <option value="http://www.yahoo.com">Yahoo</option>
</select>

1

আপনি যদি কিছু চেক করতে চান তবে এই উপায়টি ব্যবহার করুন

 <select size="1" name="links" onchange="functionToTriggerClick(this.value)">
    <option value="">Select a Search Engine</option>        
    <option value="http://www.google.com">Google</option>
    <option value="http://www.yahoo.com">Yahoo</option>
</select>

<script>

   function functionToTriggerClick(link) {

     if(link != ''){
        window.location.href=link;
        }
    }  

</script>

0

মোহাম্মদ 23 ঘড়বির উত্তরের ভিত্তিতে:

function change(selector, value) {
    var sortBySelect = document.querySelector(selector);
    sortBySelect.value = value;
    sortBySelect.dispatchEvent(new Event("change"));
}

function click(selector) {
    var sortBySelect = document.querySelector(selector);
    sortBySelect.dispatchEvent(new Event("click"));
}

function test() {
    change("select#MySelect", 19);
    click("button#MyButton");
    click("a#MyLink");
}

আমার ক্ষেত্রে, যেখানে উপাদানগুলি শপথের দ্বারা তৈরি করা হয়েছিল, এটি একমাত্র উপায় যা কাজ করে।


0

আপনার সমস্যা সমাধানের জন্য আপনি কোডের নীচে চেষ্টা করতে পারেন:

ডিফল্টরূপে প্রথম বিকল্পটি নির্বাচন করুন: jQuery ('। সিলেক্ট')। সন্ধান করুন ('বিকল্প') [0] .নির্বাচিত = সত্য;

ধন্যবাদ, কেতন টি

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.