jQuery - परिवर्तन इनपुट टेक्स्ट

Question

पर मैं एक फ़ंक्शन बनाने की कोशिश कर रहा हूं जो text input field के मान को परिवर्तित कर दिया जाएगा। जब फ़ील्ड सेल पर क्लिक किया जाता है तो क्षेत्र का मान बदलता है, keyup पर नहीं, न ही पेस्ट करें। मैं इसे इस तरह की कोशिश की:

$("#kat").change(function(){ 
    alert("Hello"); 
}); 

और मैं पाठ क्षेत्र है:

<input type="text" id="kat" value="0"/> 

लेकिन यह काम नहीं कर रहा है। कोई मदद?

Answer 1

यह jQuery प्रलेखन पृष्ठ पर एक टिप्पणी से है:

पुराने, पूर्व एचटीएमएल 5 ब्राउज़रों में, "KeyUp" निश्चित रूप से आप के लिए क्या देख रहे हैं।

एचटीएमएल 5 में एक नई घटना है, "इनपुट", जो आपको लगता है कि "परिवर्तन" का व्यवहार करना चाहिए जैसा कि लगता है कि इसमें एक फ़ाइल में जानकारी दर्ज करने के लिए एक कुंजी दबाई जाती है।

$ ('तत्व')। बाइंड ('इनपुट', फ़ंक्शन);

Answer 2

jQuery प्रलेखन कहना है कि यह "यह भी [हैंडलर निष्पादन परिणाम] प्रदर्शित किया जाता है यदि आप क्षेत्र में पाठ बदलने के लिए और फिर दूर क्लिक करें। क्षेत्र के बिना सामग्री बदल रहा है, हालांकि, घटना ध्यान केंद्रित खो देता है ट्रिगर नहीं किया गया है। "

इस तरह, KeyUp और keydown घटनाओं का प्रयास करें:

$("#kat").keydown(function(){ 
    alert("Hello"); 
}); 

Answer 3

मुझे लगता है आप जावास्क्रिप्ट में पाठ फ़ील्ड का मान अद्यतन कर रहे हैं की तरह। onchange ईवेंट तभी ट्रिगर किया जाएगा जब आप टेक्स्ट फ़ील्ड से डेटा और टैब में कुंजी-इन करेंगे।

स्क्रिप्ट से टेक्स्टबॉक्स मान को संशोधित करते समय टेक्स्टबॉक्स परिवर्तन ईवेंट को ट्रिगर करना एक वर्कअराउंड है। नीचे देखें,

$("#kat").change(function(){ 
    alert("Hello"); 
}); 


$('<tab_cell>').click (function() { 
    $('#kat') 
     .val($(this).text()) //updating the value of the textbox 
     .change();   //trigger change event. 
}); 

Answer 4

यह मेरे लिए काम कर रहा है। जैसा कि बताया गया है, एक ब्राउज़र समस्या हो सकती है, या शायद jQuery ठीक से पंजीकृत नहीं है, या शायद वास्तविक समस्या अधिक जटिल है (आपने यह पूछने के लिए एक सरल संस्करण बनाया है)। पीएस - इसे आग बनाने के लिए टेक्स्ट बॉक्स से बाहर क्लिक करना पड़ा।

http://jsfiddle.net/toddhd/Qt7fH/

Answer 5

इस तकनीक को मेरे लिए काम कर रहा है:

$('#myInputFieldId').bind('input',function(){ 
       alert("Hello"); 
    }); 

ध्यान दें कि this JQuery doc के अनुसार, "पर" के बजाय नए संस्करण में बाँध से सिफारिश की है।

Answer 6

यह सभी ब्राउज़रों पर मेरे लिए काम करता और jQuery < = v1.10

$('#kat').on('keyup', function() { 
    alert("Hello"); 
}); 

या ऐसा लगता है के रूप में आप

$('#kat').on('click', function() { 
    alert("Hello"); 
}); 

पाठ बॉक्स इनपुट क्षेत्र परिवर्तन घटना आग आप के लिए यह उम्मीद करेंगे के रूप में चाहते हैं , jQuery।परिवर्तन ईवेंट केवल एचटीएमएल 5 समर्थित ब्राउज़रों

पर ठीक से काम करता

Answer 7

इस के लिए मुझे

var change_temp = ""; 
$('#url_key').bind('keydown keyup',function(e){ 
    if(e.type == "keydown"){ 
     change_temp = $(this).val(); 
     return; 
    } 
    if($(this).val() != change_temp){ 
     // add the code to on change here 
    } 

}); 

काम किया

Answer 8

function search() { 
     var query_value = $('input#search').val(); 
     $('b#search-string').html(query_value); 
     if(query_value !== ''){ 
      $.ajax({ 
       type: "POST", 
       url: "search.php", 
       data: { query: query_value }, 
       cache: false, 
       success: function(html){ 
        //alert(html); 
        $("ul#results").html(html); 
       } 
      }); 
     }return false;  
    } 

    $("input#search").live("keyup", function(e) { 
     clearTimeout($.data(this, 'timer')); 

     var search_string = $(this).val(); 

     if (search_string == '') { 
      $("ul#results").fadeOut(); 
      $('h4#results-text').fadeOut(); 
     }else{ 
      $("ul#results").fadeIn(); 
      $('h4#results-text').fadeIn(); 
      $(this).data('timer', setTimeout(search, 100)); 
     }; 
    }); 


and the html 
<input id="search" style="height:36px; font-size:13px;" type="text" class="form-control" placeholder="Enter Mobile Number or Email" value="<?php echo stripcslashes($_REQUEST["string"]); ?>" name="string" /> 
     <h4 id="results-text">Showing results for: <b id="search-string">Array</b></h4> 
     <ul id="results"></ul> 

Answer 9

इस प्रयास करें,

$('#kat').on('input',function(e){ 
alert('Hello') 
}); 

Answer 10

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

$(document).ready(function(){ 
    $("#kat").change(function(){ 
     alert("Hello"); 
    }); 
});