मास्क इनपुट समस्या के बाद कैसे करें?

Question

मैं एक पाठ बॉक्स मुखौटा करने के लिए एक स्क्रिप्ट चल रहा है, यहाँ यह

<script src="http://jquery-joshbush.googlecode.com/ 
files/jquery.maskedinput-1.2.2.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
jQuery(function($) { 

     $('#j').mask('99:99'); 
     }); 
</script> 

मैं भी जब मैं एक बटन

<script type="text/javascript"> 
    function addRow(tableID) { 

       var table = document.getElementById(tableID); 

       var rowCount = table.rows.length; 
       var row = table.insertRow(rowCount); 

       var colCount = table.rows[0].cells.length; 

       for(var i=0; i<colCount; i++) { 

        var newcell = row.insertCell(i); 

        newcell.innerHTML = table.rows[0].cells[i].innerHTML; 
        //alert(newcell.childNodes); 
        switch(newcell.childNodes[0].type) { 
         case "text": 
           newcell.childNodes[0].value = ""; 
           newcell.childNodes[0].id="j"; 
           alert(newcell.childNodes[0].id); 
           break; 
         case "checkbox": 
           newcell.childNodes[0].checked = false; 
           break; 
         case "select-one": 
           newcell.childNodes[0].selectedIndex = 0; 
           break; 
        } 
       } 
      } 

      function deleteRow(tableID) { 
       try { 
       var table = document.getElementById(tableID); 
       var rowCount = table.rows.length; 

       for(var i=0; i<rowCount; i++) { 
        var row = table.rows[i]; 
        var chkbox = row.cells[0].childNodes[0]; 
        if(null != chkbox &amp;&amp; true == chkbox.checked) { 
         if(rowCount <= 1) { 
          alert("Cannot delete all the rows."); 
          break; 
         } 
         table.deleteRow(i); 
         rowCount--; 
         i--; 
        } 


       } 
       }catch(e) { 
        alert(e); 
       } 
      } 
    </script> 

और मेरे इनपुट बॉक्स हैं क्लिक करें एक स्क्रिप्ट गतिशील पाठ बॉक्स जोड़ने के लिए हो रहा है

<INPUT type="text" name="STime[]" id="j"/> 

<INPUT type="text" name="ETime[]" id="j"/>

समस्या मैं अब है का सामना करना पड़ रहा है, पहले पाठ बॉक्स एक नकाबपोश होगा संरचना, लेकिन जब मैं जे स्क्रिप्ट की मदद से गतिशील रूप से एक टेक्स्ट बॉक्स जोड़ता हूं, तो मुझे टेक्स्ट बॉक्स को मुखौटा के रूप में नहीं मिलेगा? क्यों ?? मैंने क्या ग़लत किया था?

Answer 1

livequery plug-in का उपयोग करें। फिर उन सभी तत्वों को दें जिन्हें आप क्लास maskme मास्क करना चाहते हैं। अब आप कर सकते हैं:

$(".maskme").livequery(function(){ 
    $(this).mask('99:99'); 
}); 

यह कोड पहले चलाने के बाद भी मास्क इनपुट जोड़ देगा।

Answer 2

मास्क प्लग-इन डोम में नए तत्वों के लिए लाइव बाध्यकारी नहीं है, बल्कि आपके $ ('j j') चयनकर्ता से तत्कालीन मौजूदा तत्व पर बाध्यकारी है।

1. एक आईडी के बजाय एक वर्ग का प्रयोग करें
यदि आवश्यक हो
2. , और (के बाद से आप कानूनी तौर पर दो पृष्ठ पर एक ही आईडी वाले तत्व नहीं कर सकते हैं), को जोड़ने के बाद फिर से फोन आपके गतिशील रूप से बनाए गए तत्वों पर .mask() डोम

Answer 3

पहले न अगर आपके jQuery का उपयोग कर तो इसका इस्तेमाल इनपुट

<input type="text" name="STime[]" class="jClass"/> 

दूसरा पर आईडी का उपयोग करें। यह पढ़ने के लिए बहुत आसान है।

<script type="text/javascript"> 
    function addRow(tableID) { 
     var table = $("#" + tableID); //get the table 
     var firstRowClone = $("tr:first", table).clone(); //clone the first row 
     $("input:checkbox",firstRowClone).attr("checked", false); // set all checkboxes to unchecked 
     $("select", firstRowClone).each(function() { //Set all select lists to select first item 
     this.selectedIndex = 0; 
     } 
     table.append(firstRowClone); //append the cloned row to the table. 
     $("input:text", firstRowClone).val("").mask("99:99"); //set all input type="text" with value of "" and sets the mask on the clone. 

    }); 

    function deleteRow(tableID) { 
     $("#" + tableId + " tr:not(:eq(0))").remove(); //Remove all rows except the first row.   
    } 


    $(document).ready(function { 
     $('.jClass').mask('99:99'); //sets the mask on any rows loaded initially 
    }); 

</script> 

Answer 4

कक्षा के साथ इनपुट में बाध्यकारी एक ईवेंट बनाएं (यदि आपके पास नहीं है तो आईडी का उपयोग न करें) आप लक्ष्यीकरण कर रहे हैं।

<input class="classSelector" /> 

<script> 
    $(document).on("focus", "classSelector", function() { 
    $(this).mask("99:99"); 
    }); 
</script> 

आप गतिशील रूप से उन आदानों आप चाहते हैं के रूप में कई बना सकते हैं और घटना के लिए बाध्यकारी का उपयोग कर उन्हें मुखौटा कर सकते हैं: jQuery विधि .on http://api.jquery.com/on/

उदाहरण का प्रयोग करें। आपके द्वारा बनाए गए उस वर्ग के साथ हर नया इनपुट उस ईवेंट हैंडलर से जुड़ा होगा।