ट्रिगर का परिवर्तन () ईवेंट सेट करते समय वैल () फ़ंक्शन के साथ <select> का मान


132

चुनिंदा तत्व के मूल्य को सेट करते समय परिवर्तन घटना को ट्रिगर करने का सबसे आसान और सबसे अच्छा तरीका क्या है ।

मुझे उम्मीद है कि निम्नलिखित कोड निष्पादित कर रहा है

$('select#some').val(10);

या

$('select#some').attr('value',  10);

परिवर्तन की घटना को ट्रिगर करने में परिणाम होगा, जो मुझे लगता है कि किया जाना बहुत तार्किक बात है। सही?

खैर, यह मामला नहीं है। आपको ऐसा करके ट्राइगर चेंज () इवेंट की आवश्यकता है

$('select#some').val(10).change();

या

$('select#some').val(10).trigger('change');

लेकिन मैं कुछ समाधान की तलाश कर रहा हूं जो कि कुछ जावास्क्रिप्ट कोड द्वारा चयन मान को बदलते ही परिवर्तन घटना को ट्रिगर करेगा।


शुद्ध जावास्क्रिप्ट तत्व।
मैनुअल बिट्टो

4
$ ( 'चुनिंदा # कुछ') वैल (10) .change ()।; उपयोगकर्ता के लिए बहुत ही तत्काल है।
दिमित्री

@ मैनुअल मैंने कोशिश की है। iv'e ने object.change = function (.... and object.addEventListener (... लेकिन object.value, $ (ऑब्जेक्ट) .val।) और $ (ऑब्जेक्ट) .attr ('value') का उपयोग नहीं किया। उस श्रोता को ट्रिगर करेगा
गोरन

जवाबों:


124

मेरे पास एक समान मुद्दा था और मुझे यकीन नहीं है कि आपको क्या समस्या है, क्योंकि आपके सुझाए गए कोड ने मेरे लिए बहुत काम किया। यह तुरंत (आपकी एक आवश्यकता) निम्नलिखित परिवर्तन कोड को ट्रिगर करता है।

$('#selectField').change(function(){
    if($('#selectField').val() == 'N'){
        $('#secondaryInput').hide();
    } else {
        $('#secondaryInput').show();
}
});

फिर मैं डेटाबेस से मूल्य लेता हूं (यह नए इनपुट और मौजूदा रिकॉर्ड दोनों को संपादित करने के लिए एक फॉर्म पर उपयोग किया जाता है), इसे चयनित मूल्य के रूप में सेट करें, और उस टुकड़े को जोड़ें जो मुझे उपरोक्त कोड को ट्रिगर करने के लिए याद आ रहा था, ".change ()। "।

$('#selectField').val(valueFromDatabase).change();

ताकि अगर डेटाबेस से मौजूदा मूल्य 'एन' हो, तो यह तुरंत मेरे फॉर्म में सेकेंडरी इनपुट फील्ड को छुपा देता है।


मुझे ठीक इसी की आवश्यकता थी। DOM इवेंट हैंडलर्स को गतिशील रूप से ट्रिगर करने का तरीका खोजने के लिए सबसे अच्छा तरीका क्या है? क्या jQuery इस अच्छी तरह से दस्तावेज़ करता है? धन्यवाद!
कॉन एंटानाकोस

2
$ ("# discount_type") .val (2) .trigger ('परिवर्तन');
सतानंद तिवारी

$ ( '# add_itp_spt_parent_id') वैल (add_fpt_val) .trigger ( 'परिवर्तन')। $ ( '# add_itp_spt_parent_id') परिवर्तन ()।; दोनों समाधान काम नहीं कर रहे हैं।
कमलेश

परिभाषित परिवर्तन समारोह आप का उपयोग कर रहे हैं, मेरी समस्या का समाधान किया। धन्यवाद।
कमलेश

45

एक बात जो मुझे पता चली (कठिन तरीका), वह यह है कि आपके पास होना चाहिए

$('#selectField').change(function(){
  // some content ...
});

परिभाषित पहले आप उपयोग कर रहे हैं

$('#selectField').val(10).trigger('change');

या

 $('#selectField').val(10).change();

4
पुरानी पोस्ट लेकिन इसने मेरी समस्या को हल कर दिया, मुझे एक लंबे घुमावदार मस्तिष्क को टूटने से बचाया ... आपको इसका उपयोग करने से पहले श्रोता को परिभाषित करना होगा। शुद्ध जावास्क्रिप्ट में भी।
तैमतायो

क्या आप थोड़ा विस्तार कर सकते हैं? क्या "परिवर्तन ()" इस कारण से नहीं है?
दिमा आर।

वैसे मैं कहूंगा कि हो सकता है कि इन श्रोताओं के श्रोताओं को लोड पर फहराया न जाए, अपने प्रोजेक्ट में, मैंने change()श्रोता को परिभाषित करने से पहले फोन किया और यह तब तक काम नहीं किया जब तक कि मैंने change()श्रोता के तहत कॉल को स्थानांतरित नहीं किया और यह काम किया। वैसे मैं कहूंगा कि यह एक समस्या नहीं होनी चाहिए, यह सिर्फ एक तरीका है जिस तरह से आप अपने कोड को बनाते हैं।
तैमायतो

1
यह वही है जो मुझे चाहिए था। इस मुद्दे को हल करने के लिए मुझे हमेशा के लिए ले लिया, धन्यवाद।
जेमी एम।

वाहवाही!!! "परिभाषित परिवर्तन फ़ंक्शन आपके द्वारा उपयोग किए जा रहे हैं", मेरी समस्या हल कर दी। धन्यवाद प्रिय।
कमलेश

17

सीधे उत्तर पहले से ही एक डुप्लिकेट प्रश्न में है: जब मैं वैल () का उपयोग करके किसी चुनिंदा का मान सेट करता हूं तो jquery परिवर्तन घटना क्यों नहीं ट्रिगर होती है?

जैसा कि आप शायद जानते हैं कि चयन का मान सेट करना परिवर्तन () घटना को ट्रिगर नहीं करता है, यदि आप एक ऐसी घटना की तलाश कर रहे हैं, जब जेएस के माध्यम से एक तत्व के मूल्य को बदल दिया गया हो तो एक नहीं है।

यदि आप वास्तव में ऐसा करना चाहते हैं, तो मुझे लगता है कि एकमात्र तरीका एक फ़ंक्शन लिखना है जो एक अंतराल पर DOM की जांच करता है और बदले हुए मानों को ट्रैक करता है, लेकिन निश्चित रूप से ऐसा न करें जब तक कि आपको ज़रूर करना चाहिए (यह सुनिश्चित नहीं करना चाहिए कि आपको कभी क्यों आवश्यकता होगी)

इस समाधान को जोड़ा गया:
एक अन्य संभावित समाधान यह होगा कि आप अपना स्वयं का .val()रैपर फ़ंक्शन बनाएं और मान को सेट करने के बाद किसी कस्टम ईवेंट को ट्रिगर करें .val(), जब आप अपने .val () रैपर का उपयोग करते हैं तो <select>यह आपके कस्टम ईवेंट को ट्रिगर करेगा। जिसे आप फँसा सकते हैं और संभाल सकते हैं।

सुनिश्चित करें return this, इसलिए यह jQuery के फैशन में श्रृंखला योग्य है


मैंने इस प्रश्न पर कई मंचों को पढ़ा है, और आपका उत्तर अंतिम पूर्ण था जिसे मैं देख रहा था। ट्रैकिंग का विचार केवल एक मानसिक प्रयोग के रूप में काम करता है, जाहिर है कि यह पूरी तरह से अव्यवहारिक होगा, लेकिन यह निराशाजनक है; और रैपर का विचार बहुत बढ़िया है, और "वापसी इस" भाग को इंगित करने के लिए धन्यवाद। सादर।
डेविड एल

$('select').val(value).change()हर समय काम क्यों नहीं करेगा ? कोई स्पष्ट व्याख्या?
इस्तियाक अहमद

2

मैं इसे अलग करता हूं, और फिर आगे क्या होता है, यह निर्धारित करने के लिए एक पहचान की तुलना का उपयोग करें।

$("#selectField").change(function(){
  if(this.value === 'textValue1'){ $(".contentClass1").fadeIn(); }
  if(this.value === 'textValue2'){ $(".contentclass2").fadeIn(); }
});

2

जैसे कि jQuery मूल परिवर्तन की घटना को ट्रिगर नहीं करेगा, लेकिन केवल अपने स्वयं के परिवर्तन की घटना को ट्रिगर करता है। यदि आप jQuery के बिना ईवेंट को बाँधते हैं और तब jQuery का उपयोग करते हैं तो यह आपके द्वारा बाध्य कॉलबैक को ट्रिगर नहीं करेगा!

समाधान फिर नीचे (100% काम) की तरह है:

var sortBySelect = document.querySelector("select.your-class"); 
sortBySelect.value = "new value"; 
sortBySelect.dispatchEvent(new Event("change"));
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.