jQuery। अंतराल परिवर्तन इनपुट मान को परिवर्तित नहीं करता है

Question

मेरे पास मूल्य में एक लिंक के साथ एक HTML इनपुट है।

<input type = 'text' value = 'http://www.link.com' id = 'link' />

मैं एक निश्चित घटना पर मूल्य को बदलने के लिए jQuery का उपयोग कर रहा हूं।

$('#link').val('new value');

उपरोक्त कोड टेक्स्ट बॉक्स के मूल्य को बदल देता है, लेकिन कोड में मूल्य नहीं बदलता है (मान = 'http://www.link.com' अपरिवर्तित रहता है)। मुझे बदलने के लिए मूल्य = '' की भी आवश्यकता है।

Comments

आपका क्या मतलब है in the code? क्या आप पृष्ठ का मूल (इस प्रकार, अनमॉडिफाइड) स्रोत देख रहे हैं?

— Frédéric Hamidi

क्रोम के निरीक्षण तत्व का उपयोग करना।

— लुकास

@Luke मान बदल जाएगा, लेकिन Chrome के इंस्पेक्टर में HTML तत्व का दृश्यमान मान नहीं होगा। फिर कोशिश करें कि मूल्य को सचेत करें या इसे कंसोल पर आउटपुट करें और आप देखेंगे कि यह बदल गया है। देखें, यह बदल गया है: jsfiddle.net/a8SxF

— TheZ

हां अब मैं देख रहा हूं। मैं क्लिपबोर्ड के मान को कॉपी करने के लिए zClip का उपयोग कर रहा हूं, लेकिन यह बदलने के बाद पुराने मूल्य की नकल कर रहा है। मुझे लगता है कि मैं इसे थोड़ा गड़बड़ करने के साथ ठीक कर सकता हूं।

— लुकास

HTML

— Esailija

Answer 1

attrइसके बजाय उपयोग करें ।
$('#link').attr('value', 'new value');

डेमो

Comments

यह पूरी तरह से सही है, इसका उपयोग करके setAttributeया jQuery के attrआप DOM तत्व के मूल्य को भी प्रभावित करेंगे: jsfiddle.net/a8SxF/1

— TheZ

@ ऐसा इसलिए है क्योंकि इनपुट का गंदा मूल्य ध्वज गलत है। और फिर setAttribute (मूल्य उपयोगकर्ता इनपुट के बाद गंदा है) इनपुट के साथ बातचीत की कोशिश करो

— Esailija

लेकिन जब आप html को प्राप्त करना चाहते हैं .html(), तो अभी भी वही पुराना मूल्य होगा, अगर आप उपयोग करते हैं .val('new value')या नहीं attr('value', 'new value')...:

— Legionar

.Val का उपयोग करके कार्यों का एक विशाल और जटिल गुच्छा कोडित किया गया (जैसा कि मैंने पहले पढ़ा था सब कुछ द्वारा सुझाया गया है) और इसमें ठीक यही समस्या थी। खूनी गुस्सा! यह उत्तर किसी भी jQuery के newbies के लिए कॉल का पहला बिंदु होना चाहिए जो प्रपत्र तत्वों को गतिशील रूप से अपडेट करना चाहते हैं। अगर मैं इसे पहले पढ़ता हूँ तो मुझे कुछ ही घंटों में बचाया जा सकता है!

— अनुदान

यही कारण है कि जावास्क्रिप्ट / JQuery के साथ चल रहे मैदान को हिट करने के लिए इतना मुश्किल है, इस तरह से कई कैविएट। इसने मेरी बहुत मदद की। धन्यवाद!

— eaglei22

Answer 2

मान गुण बदलने से परिवर्तन नहीं होता है defaultValue। कोड में ( .html()या इसके साथ पुनर्प्राप्त innerHTML) मूल्य विशेषता defaultValueमें मूल्य संपत्ति नहीं होगी ।

Comments

इससे स्पष्ट हुआ। टंकण <इनपुट आईडी = 'ए' मूल्य भी नहीं बदलता है, लेकिन $ ("# ए") के परिणाम को प्रभावित करता है। ()। एक सवाल सिर्फ यह सुनिश्चित करने के लिए: क्या $ ("# ए") वैल (मूल्य) वास्तव में सही तरीका है कि इनपुट तत्व के मूल्य को कैसे बदला जाए, ताकि सही मूल्य प्रस्तुत किया जाए?

— डैनियल काट्ज़

हां यह सही है। विशेषता बदलने से जो प्रस्तुत किया जा रहा है वह नहीं बदलेगा।

— केविन बी।

Answer 3

रिकार्डो के उत्तर पर थोड़ा विस्तार करने के लिए: https://stackoverflow.com/a/11873775/7672426

http://api.jquery.com/val/#val2

वैल के बारे में ()

इस विधि का उपयोग करके मान सेट करना (या मूल मूल्य संपत्ति का उपयोग करना) परिवर्तन घटना के प्रेषण का कारण नहीं बनता है। इस कारण से, प्रासंगिक ईवेंट हैंडलर निष्पादित नहीं किए जाएंगे। यदि आप उन्हें निष्पादित करना चाहते हैं, तो आपको मूल्य सेट करने के बाद .trigger ("परिवर्तन") को कॉल करना चाहिए।

Answer 4

यह सिर्फ एक संभावित परिदृश्य है जो मेरे साथ हुआ। खैर अगर यह किसी की मदद करता है तो महान: मैंने एक जटिल ऐप लिखा था जो कोड के साथ कहीं भी मैंने उन्हें दिखाने से पहले सभी टेक्स्टबॉक्स मूल्यों को साफ़ करने के लिए एक फ़ंक्शन का उपयोग किया। कुछ समय बाद मैंने jquery val ('value') का उपयोग करके एक टेक्स्टबॉक्स मान सेट करने की कोशिश की, लेकिन मैंने यह नोटिस नहीं किया कि ठीक उसके बाद मैंने ClearAllInputs विधि को लागू किया .. इसलिए, यह भी हो सकता है।

Answer 5

$('#link').prop('value', 'new value');

स्पष्टीकरण: Attr jQuery 1.6 पर काम करेगा लेकिन jQuery 1.6.1 के रूप में चीजें बदल गई हैं। बहुमत के मामलों में, प्रोप () वही करता है जो attr () करता था। आपके कोड में प्रोप () के साथ कॉल अट्रर () में बदलना आम तौर पर काम करेगा। Attr आपको तत्व का मूल्य देगा क्योंकि यह पृष्ठ लोड पर html में परिभाषित किया गया था और प्रोप उन तत्वों के अद्यतन मूल्यों को देता है जिन्हें jQuery द्वारा संशोधित किया गया है।

Comments

अपने उत्तर को भी स्पष्ट करने का प्रयास करें

— विनोथ कृष्णन

Answer 6

मेरा समान मुद्दा चयनकर्ता में विशेष वर्ण (जैसे अवधि) होने के कारण था।

विशेष पात्रों से बचने के लिए तय किया गया था:

$("#dots\\.er\\.bad").val("mmmk");

Comments

सहमत, बहुत बुरा, आपको बचना नहीं चाहिए, आपको अपने तत्व की आईडी का नाम बदलना चाहिए।

— वेबहॉलिक जूल

Answer 7

<script src="//code.jquery.com/jquery.min.js"></script>
<script>
function changes() {
$('#link').val('new value');
}
</script>
<button onclick="changes()">a</button>
<input type='text' value='http://www.link.com' id='link'>

Comments

हाँ, हालांकि यह वास्तविक मूल्य को अद्यतन नहीं करता है। यह ऑन स्क्रीन टेक्स्ट बॉक्स को अपडेट करता है, लेकिन जब आप एक फॉर्म सबमिट करने का प्रयास करते हैं, तो वह वह होता है जब वह पेज मूल रूप से लोड होता था।

— अनुदान

Answer 8

मेरे लिए समस्या यह थी कि इस क्षेत्र के लिए मूल्य को बदलना काम नहीं करता था:

$('#cardNumber').val(maskNumber);

ऊपर दिए गए किसी भी समाधान ने मेरे लिए काम नहीं किया इसलिए मैंने आगे जांच की और पाया:

DOM लेवल 2 इवेंट स्पेसिफिकेशन के अनुसार: परिवर्तन घटना तब होती है जब कोई नियंत्रण इनपुट फ़ोकस खो देता है और फ़ोकस प्राप्त करने के बाद से इसका मान संशोधित किया जाता है। इसका मतलब है कि परिवर्तन की घटना को उपयोगकर्ता इंटरैक्शन द्वारा परिवर्तन पर आग लगाने के लिए डिज़ाइन किया गया है। प्रोग्रामेटिक परिवर्तन इस घटना को निकाल नहीं सकते हैं।

समाधान ट्रिगर फ़ंक्शन को जोड़ने और इसे इस तरह से परिवर्तन की घटना को ट्रिगर करने के लिए किया गया था:

$('#cardNumber').val(maskNumber).trigger('change');

Answer 9

गैर-अद्वितीय आईडी के साथ एक से अधिक तत्वों के लिए डबल चेक! यही स्थिति मेरी आईडी के फ़ॉरच लूप और डुप्लिकेटेशन की थी।