এইচটিএমএল সিলেক্ট করে onChange এ প্যারামিটারগুলি কীভাবে পাস করবেন

Question

আমি জাভাস্ক্রিপ্ট এবং jQuery এ নবাগত। আমি একটি কম্বোবক্স-এ দেখাতে চাই, এটি একটি এইচটিএমএল যা অনি চেঞ্জ () এ অন্য জায়গায় <select>নির্বাচিত idএবং সামগ্রীগুলি সহ with

আমি এর সিলেক্ট সহ সম্পূর্ণ কম্বোবক্সকে idকীভাবে পাস করতে পারি এবং কীভাবে আমি অন চেঞ্জ ইভেন্টের আগুনে অন্যান্য পরামিতিগুলি পাস করতে পারি?

Comments

আপনি কিছু কোড পোস্ট করতে পারেন দয়া করে?

— কেজেওয়াই.নেম 葉家仁

Answer 1

function getComboA(selectObject) {
  var value = selectObject.value;  
  console.log(value);
}

<select id="comboA" onchange="getComboA(this)">
  <option value="">Select combo</option>
  <option value="Value1">Text1</option>
  <option value="Value2">Text2</option>
  <option value="Value3">Text3</option>
</select>

উপরের উদাহরণটি আপনাকে অন চেঞ্জ ইভেন্টে কম্বো বাক্সের নির্বাচিত মান দেয় ।

Comments

ধন্যবাদ, এটি আমার পক্ষে কাজ করেছে। মূলত আমি একই জায়গায় কম্বোবক্সটি বিভিন্ন স্থানে দেখাতে চাই, তাই আমি 2 টি কম্বোবক্সকে 2 টি আলাদা আইডি দিয়েছি there সেখানে যাই হোক, আমি একই জায়গায় একই জায়গায় কম্বোবক্স দেখাতে পারি। যে কোন সাহায্য সাদরে গৃহীত হবে।

— জেন্ডাফুল

ভিতরে মানটি পুনরুদ্ধার করার আরও একটি সুসংগত উপায় getComboA()হ'লvar value = sel.value;

— যোনি

পরিবর্তিত ইভেন্টটি কেবল তখনই নির্বাচিত বাক্সটিতে ফোকাস হারায় fire কোনও মান পরিবর্তনের পরে অবিলম্বে ইভেন্টটি চালানোর কোনও উপায় আছে কি?

— doABarrelRoll721

পরিবর্তে এটি ব্যবহার করুন এবং এটি কাজ করবে =) এটি প্রেরণ পুরো নির্বাচন উপাদান পাঠাচ্ছে

— কলিন রিকেলস

আমার ক্ষেত্রে কোড ফায়ারফক্সে কাজ করছে তবে ক্রোমে নয়।

— অভিজিত ভট্টাচার্জি

Answer 2

অন্য পরিস্থিতিতে যা কিছু পরিস্থিতিতে কার্যকর হতে পারে, নির্বাচিতদের মানটি এইভাবে <option />সরাসরি ফাংশনে প্রেরণ করে :

function myFunction(chosen) {
  console.log(chosen);
}

<select onChange="myFunction(this.options[this.selectedIndex].value)">
  <option value="1">Text 1</option>
  <option value="2">Text 2</option>
</select>

Comments

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

— ফ্ল্যাশনুব 468

এটা সুন্দর. আর একটি সহজ কার্যকর বৈধ বিকল্প: <চ্যানেলটি নির্বাচন করুন = "আমার ফাংশন (এটি.মূল্য)">

— ড্যানিয়েল সিলভা

নির্বাচিত বিকল্পের অন্যান্য বৈশিষ্ট্য অ্যাক্সেস করতে দরকারী।

— সিইস টিমারম্যান

Answer 3

কীভাবে এটি jQuery এ করবেন:

<select id="yourid">
<option value="Value 1">Text 1</option>
<option value="Value 2">Text 2</option>
</select>

<script src="jquery.js"></script>
<script>
$('#yourid').change(function() {
  alert('The option with value ' + $(this).val() + ' and text ' + $(this).text() + ' was selected.');
});
</script>

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

Comments

আমি এটি চেষ্টা করেছিলাম, তবে পরিবর্তন ফাংশনটি ডকুমেন্ট.ডিয়ার পদ্ধতিতে রেখে দিলেও কল হচ্ছে না। আমার কোডটি এইচটিএমএলডাটা.পুশ ('<সিলেক্ট আইডি = "বেছে নিন" নাম = "বেছে নিন">'); $ ('# પસંદ')। পরিবর্তন (ফাংশন () {সতর্কতা ('পরিবর্তন বলা হয়'); সতর্কতা ('মান সহ বিকল্প' + $ (এটি) .মূল্য () + 'এবং পাঠ্য' + $ (এটি) পাঠ্য () + 'নির্বাচন করা হয়েছিল' '); দয়া করে আমাকে

— এটিতে

@ জেন্ডাফুল: কৌতুকটি করা htmlData.push($('<select id="choose" name="choose">'));উচিত (আপনি পূর্বে ফুল- ব্লোড নোডের পরিবর্তে একটি স্ট্রিং ঠেলে দিয়েছিলেন)। > 6 বছর

— জোহানেস

Answer 4

জাভাস্ক্রিপ্ট সমাধান

<select id="comboA">
<option value="">Select combo</option>
<option value="Value1">Text1</option>
<option value="Value2">Text2</option>
<option value="Value3">Text3</option>
</select>

<script>
 document.getElementById("comboA").onchange = function(){
    var value = document.getElementById("comboA").value;
 };
</script>

অথবা

<script>
 document.getElementById("comboA").onchange = function(evt){
    var value = evt.target.value;
 };
</script>

অথবা

<script>
 document.getElementById("comboA").onchange = handleChange;

 function handleChange(evt){
    var value = evt.target.value;
 };
</script>

Comments

এটি এখানে সর্বাধিক সাধারণ এবং ব্যাপক সমাধান। ধন্যবাদ!

— divs1210

Answer 5

আমি @ পীযূশের উত্তরটি সহায়ক বলে খুঁজে পেয়েছি এবং কেবল এটি যুক্ত করার জন্য, আপনি যদি ক্রমগতভাবে একটি নির্বাচন তৈরি করেন, তবে এই আচরণটি পাওয়ার একটি গুরুত্বপূর্ণ উপায় আছে যা সুস্পষ্ট নাও হতে পারে। ধরা যাক আপনার একটি ফাংশন রয়েছে এবং আপনি একটি নতুন নির্বাচন তৈরি করুন:

var changeitem = function (sel) {
  console.log(sel.selectedIndex);
}
var newSelect = document.createElement('select');
newSelect.id = 'newselect';

স্বাভাবিক আচরণ বলতে পারে

newSelect.onchange = changeitem;

তবে এটি আপনাকে সেই আর্গুমেন্টটি নির্দিষ্টভাবে নির্দিষ্ট করতে দেয় না, পরিবর্তে আপনি এটি করতে পারেন:

newSelect.setAttribute('onchange', 'changeitem(this)');

এবং আপনি প্যারামিটার সেট করতে সক্ষম হন। আপনি যদি এটি প্রথম উপায়ে করেন, তবে আপনার onchangeফাংশনে যে যুক্তিটি পাবেন তা ব্রাউজার নির্ভর। দ্বিতীয় উপায়টি ক্রস ব্রাউজারটি ঠিক সূক্ষ্মভাবে কাজ করে বলে মনে হচ্ছে।

Comments

আপনার অশুভ- evalমত স্ট্রিং-থেকে কোড রূপান্তর প্রয়োজনীয় নয়। প্রকৃতপক্ষে newSelect.onchange = changeitem;সূক্ষ্মভাবে কাজ করে যদি আপনি চেজটিমেট var changeitem = function () {console.log(this.selectedIndex); };(যেমন thisকোনও ফাংশন আর্গুমেন্টের পরিবর্তে ব্যবহার করে ) পুনরায় লিখেন । অথবা, changeitemযেমনটি রেখে যান এবং লিখুন newSelect.onchange = function () {changeitem(this); };।

— স্টিভ বায়ার্নস

newSelect.setAttribute ('অগ্রিম', 'চেঞ্জিটম (এটি)'); - এর জন্য চিয়ার্স

— ঘোষ

Answer 6

jQuery সমাধান

আমি কীভাবে একটি নির্বাচিত বিকল্পের পাঠ্য মান পেতে পারি

উপাদানগুলি নির্বাচন করুন সাধারণত দুটি মান থাকে যা আপনি অ্যাক্সেস করতে চান।
প্রথমে সার্ভারে প্রেরণের মান রয়েছে যা সহজ:

$( "#myselect" ).val();
// => 1

দ্বিতীয়টি হল নির্বাচনের পাঠ্য মান ।
উদাহরণস্বরূপ, নিম্নলিখিত নির্বাচন করা বাক্সটি ব্যবহার করে:

<select id="myselect">
  <option value="1">Mr</option>
  <option value="2">Mrs</option>
  <option value="3">Ms</option>
  <option value="4">Dr</option>
  <option value="5">Prof</option>
</select>

যদি আপনি "মিস্টার" স্ট্রিংটি পেতে চান যদি প্রথম বিকল্পটি নির্বাচিত হয় (কেবল "1" এর পরিবর্তে) আপনি নিম্নলিখিত পদ্ধতিতে এটি করতে পারেন:

$( "#myselect option:selected" ).text();
// => "Mr"  

আরো দেখুন

• .val () jQuery API ডকুমেন্টেশন

Answer 7

এটা আমার জন্য সাহায্য করা হয়।

নির্বাচনের জন্য:

$('select_tags').on('change', function() {
    alert( $(this).find(":selected").val() );
});

রেডিও / চেকবক্সের জন্য:

$('radio_tags').on('change', function() {
    alert( $(this).find(":checked").val() );
});

Answer 8

আপনি বেলো কোড চেষ্টা করতে পারেন

<select onchange="myfunction($(this).val())" id="myId">
    </select>

Answer 9

এই কোডটি আমি একবার মাত্র লিখতে চাইলে নির্বাচনের ইভেন্ট পরিবর্তন করুন আপনি এই কোডটি এইচটিএমএল হিসাবে সংরক্ষণ করতে পারেন এবং আউটপুট এটি কাজ করে দেখতে পারেন and এবং আপনার পক্ষে বোঝা সহজ।

<html>
    <head>
        <title>Register</title>
    </head>
    <body>
    <script>
        function show(){
            var option = document.getElementById("category").value;
            if(option == "Student")
                  {
                        document.getElementById("enroll1").style.display="block";
                  }
            if(option == "Parents")
                  {
                        document.getElementById("enroll1").style.display="none";
                  }
            if(option == "Guardians")
                  {
                        document.getElementById("enroll1").style.display="none";
                  }
        }
    </script>
            <form action="#" method="post">
                <table>
                    <tr>
                        <td><label>Name </label></td>
                        <td><input type="text" id="name" size=20 maxlength=20 value=""></td>
                    </tr>
                    <tr style="display:block;" id="enroll1">
                        <td><label>Enrollment No. </label></td>
                        <td><input type="number" id="enroll" style="display:block;" size=20 maxlength=12 value=""></td>
                    </tr>
                    <tr>
                        <td><label>Email </label></td>
                        <td><input type="email" id="emailadd" size=20 maxlength=25 value=""></td>
                    </tr>
                    <tr>
                        <td><label>Mobile No. </label></td>
                        <td><input type="number" id="mobile" size=20 maxlength=10 value=""></td>
                    </tr>
                    <tr>
                        <td><label>Address</label></td>
                        <td><textarea rows="2" cols="20"></textarea></td>
                    </tr>
                    <tr >
                        <td><label>Category</label></td>
                        <td><select id="category" onchange="show()">    <!--onchange show methos is call-->
                                <option value="Student">Student</option>
                                <option value="Parents">Parents</option>
                                <option value="Guardians">Guardians</option>
                            </select>
                        </td>
                    </tr>
                </table><br/>
            <input type="submit" value="Sign Up">
        </form>
    </body>
</html>

Answer 10

আপনি যদি লিখতে পারেন এমন অতিরিক্ত নির্ভরতাগুলি ডাউনলোড না করে কেবল কেউ প্রতিক্রিয়ার সমাধান খুঁজছেন:

<select onChange={this.changed(this)}>
   <option value="Apple">Apple</option>
   <option value="Android">Android</option>                
</select>

changed(){
  return e => {
    console.log(e.target.value)
  }
}

পরিবর্তিত () ফাংশনটি কন্সট্রাক্টরের মতো আবদ্ধ করার বিষয়টি নিশ্চিত করুন:

this.changed = this.changed.bind(this);

Answer 11

এটি আমার জন্য অন্বেষণ = setLocation($(this).val())

এখানে.

    @Html.DropDownList("Demo", 
new SelectList(ViewBag.locs, "Value", "Text"), 
new { Class = "ddlStyle", onchange = "setLocation($(this).val())" });