jquery নির্বাচন ইভেন্ট পরিবর্তন নির্বাচন করুন

Question

আমি এর সাথে আমার নির্বাচিত উপাদানগুলির পরিবর্তন ইভেন্টের উপর একটি ইভেন্ট আবদ্ধ করেছি:

$('select').on('change', '', function (e) {

});

পরিবর্তন ইভেন্টটি ঘটে যখন আমি যে উপাদানটি নির্বাচিত হয়েছি তার মধ্যে কীভাবে আমি অ্যাক্সেস করতে পারি?

Comments

তুই কেন বলিস?

— মিগুয়েল

@ সুপেরুবারডুপার আমি যতক্ষণ না পেরে jquery এড়িয়ে গেছি তবে প্রতিরোধ নিরর্থক। আপনার আত্মনিয়োগের পরে আপনি আরও অনেক ভাল বোধ করবেন।

— এডিজি

লোলল @ এডজি এত ভাল!

— সুপারউবারডুপার

Answer 1

$('select').on('change', function (e) {
    var optionSelected = $("option:selected", this);
    var valueSelected = this.value;
    ....
});

Comments

Synt ("নির্বাচক", এটি) সিনট্যাক্স বলতে কী বোঝায়? আমার একটি সাধারণ ধারণা আছে তবে আমি পুরোপুরি নিশ্চিত নই

— জোশউইলিক

আপনার সাথে জোশ উইলিক $("selector", this)আপনার প্রসঙ্গে সমস্ত selectorউপাদান খুঁজে পাচ্ছেন elements thisলেখার $("selector", this)প্রায় একইরকম $(this).find('selector')

— বেলাশ

@JoshWillik: যেহেতু $()একজন ওরফে হয় jQuery(), আপনি ডকুমেন্টেশন এখানে পেতে পারেন: api.jquery.com/jQuery স্বাক্ষর বিবৃত সেখানে স্পষ্টত হয় jQuery( selector [, context ] )। @ বেলাশ: যদি এটি "প্রায় একই" হয় তবে পার্থক্য কী? বা দ্রুত কি? আমি পছন্দ করি .find()যেহেতু এটি আরও OO আইএমও ...

— অ্যাড্রিয়ান ফেডার

একাধিক নির্বাচনের ক্ষেত্রে কীভাবে চেক করবেন?

— হেমন্ত_নেগি 25'15

@ AdrianFöder আপনি এবং অন্য লোকেরা এ খুঁজছেন জন্য, .find(): প্রায় 10% দ্রুত এই উত্তরটি অনুযায়ী stackoverflow.com/a/9046288/2767703

— কেভিন ভ্যান Mierlo

Answer 2

আপনি jQuery সন্ধানের পদ্ধতিটি ব্যবহার করতে পারেন

 $('select').change(function () {
     var optionSelected = $(this).find("option:selected");
     var valueSelected  = optionSelected.val();
     var textSelected   = optionSelected.text();
 });

উপরের সমাধানটি পুরোপুরি কাজ করে তবে আমি ক্লিক করা বিকল্প পেতে তাদের জন্য নিচের কোডটি যুক্ত করতে বেছে নিই। এই নির্বাচন মানটি পরিবর্তিত না হওয়া সত্ত্বেও এটি আপনাকে নির্বাচিত বিকল্পটি পেতে দেয়। (কেবল মোজিলার সাথে পরীক্ষিত)

    $('select').find('option').click(function () {
     var optionSelected = $(this);
     var valueSelected  = optionSelected.val();
     var textSelected   = optionSelected.text();
   });

Comments

optionইভেন্টগুলিতে বাঁধাই একটি ঝুঁকিপূর্ণ প্রস্তাব, বিশেষত মোবাইল ডিভাইসে। উদাহরণস্বরূপ, ওয়েবকিট এই ইভেন্টটি সঠিকভাবে সমর্থন করে না: bugs.chromium.org/p/chromium/issues/detail?id=5284

— ইয়ান কেম্প

ঠিক আছে শান্ত হও! আমি যেমন বলেছি, দ্বিতীয় সমাধানটি অনেকগুলি ব্রাউজারে সমর্থিত নয়!

— বেলাশ

Answer 3

নিযুক্ত বিকল্প

যদি কেউ প্রতিনিধি পন্থা ব্যবহার করে থাকে তাদের শ্রোতাদের জন্য ব্যবহার করুন e.target(এটি নির্বাচিত উপাদানটি উল্লেখ করবে)।

$('#myform').on('change', 'select', function (e) {
    var val = $(e.target).val();
    var text = $(e.target).find("option:selected").text(); //only time the find is required
    var name = $(e.target).attr('name');
}

জেএসফিডাল ডেমো

Comments

+1 কারণ এটি আমি যা চাই তা চাই, তবে যখন আমি স্থানীয়ভাবে এটি চেষ্টা করেছি তখন এটি কাজ করছে না j শুধু jsfiddle এ কাজ করুন, সিডিএন কী যুক্ত করতে হবে?

— এভিআই

Answer 4

আমি এই সংক্ষিপ্ত এবং ক্লিনার খুঁজে। এছাড়াও, আপনি যদি নির্বাচিত আইটেমগুলির মধ্যে একাধিক থাকে তবে পুনরাবৃত্তি করতে পারেন;

$('select').on('change', function () {
     var selectedValue = this.selectedOptions[0].value;
     var selectedText  = this.selectedOptions[0].text;
});

Comments

selectedOptionsসমস্ত ব্রাউজারে উপলব্ধ নয়।

— বার্নহার্ড ডাবলার

@ বার্নহার্ডডাবলার কোনটি? কোন উত্স?

— 1.44mb

আমি আপনার কোডটি আইই 11 এ অনুলিপি করেছিলাম এবং একটি ত্রুটি পেয়েছি। আমি দিয়ে শেষ this.options[ this.options.selectedIndex ]। মোজিলা জানায় 26, ফায়ারফক্স দ্বারা সমর্থিত, কোন সমর্থন নেই।

— বার্নহার্ড ডাবলার

Answer 5

<select id="selectId">
    <option value="A">A</option>
    <option value="B">B</option>
    <option value="C">C</option>
</select>


$('#selectId').on('change', function () {
     var selectVal = $("#selectId option:selected").val();
});

প্রথমে তৈরি a select option। এর পরে jqueryব্যবহারকারীর ব্যবহারের পরিবর্তনের সাথে সাথে আপনি বর্তমান নির্বাচিত মান পেতে পারেন select option।

Comments

আপনি দয়া করে আপনার উত্তর আরও বিস্তারিত ব্যাখ্যা ভাগ করতে পারেন?

— মোস্তাফিজ

@ মোস্তাফিজুর রহমান আমাদের কোড খুব সহজ এজন্যে আমি কেবল কোড লিখেছি wrote

Answer 6

$('#_SelectID').change(function () {
        var SelectedText = $('option:selected',this).text();
        var SelectedValue = $('option:selected',this).val();
});

Answer 7

নির্বাচিত মানের মান পাওয়ার জন্য আরেকটি এবং স্বল্প উপায়,

$('#selectElement').on('change',function(){
   var selectedVal = $(this).val();
                       ^^^^  ^^^^ -> presents #selectElement selected value 
                         |
                         v
               presents #selectElement, 
});

Comments

এই ক্ষেত্রে যদি, কেন অভ্যস্ত "Var selectedVal = $ (" # selectElement ")। Val ()" work¿ হয়

— লুইসে

কেসটির মান হ'ল যখন নির্বাচনের উপাদানগুলিতে পরিবর্তন ইভেন্ট নির্গত হয়। আপনি যদি এমনটি করেন তবে মানগুলি আপডেট হবে না।

— রিসেপ

Answer 8

অফিসিয়াল এপিআই ডকুমেন্টেশন https://api.jquery.com/selected-selector/ দেখুন

এই ভাল কাজ:

$( "select" ).on('change',function() {
  var str = "";
  // For multiple choice
  $( "select option:selected" ).each(function() {
    str += $( this ).val() + " "; 
  });
});

এবং

$( "select" ).on('change',function() {
  // For unique choice
  var selVal = $( "select option:selected" ).val(); 
});

এবং অনন্য পছন্দ জন্য সহজ

var SelVal = $( "#idSelect option:selected" ).val();

Answer 9

আপনি নির্বাচিত বিকল্প মান পেতে এই jquery নির্বাচন পরিবর্তন ইভেন্ট ব্যবহার করতে পারেন

ডেমো জন্য

$(document).ready(function () {   
    $('body').on('change','#select', function() {
         $('#show_selected').val(this.value);
    });
}); 

<!DOCTYPE html>  
<html>  
<title>Learn Jquery value Method</title>
<head> 
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> 
</head>  
<body>  
<select id="select">
 <option value="">Select One</option>
    <option value="PHP">PHP</option>
    <option value="jAVA">JAVA</option>
    <option value="Jquery">jQuery</option>
    <option value="Python">Python</option>
    <option value="Mysql">Mysql</option>
</select>
<br><br>  
<input type="text" id="show_selected">
</body>  
</html>