jquery प्रोग्रामेटिक रूप से नए डोम तत्व

पर क्लिक करें मैं jquery में कुछ मुश्किल (कम से कम मेरे लिए) करने की कोशिश कर रहा हूं।jquery प्रोग्रामेटिक रूप से नए डोम तत्व

function add_course(){ 
     var id = $(this).attr('id'); 
     if ($(this).is(':checked')){ 

      if($('#courseInput').val().search(id) < 0){ 
       $('#CourseSummary').append('<span id="cn'+id+'"><a href="#" class="courseDel" id="'+id+'">X</a> '+$('#course'+id+' a').html()+'<br/></span>'); 
       $('#courseInput').val(function(index,value){ 
        return value+ id +',1;'; 
       }); 
       addTotal($('#price'+id).text()); 
      } 
      imageSync(); 
     }else{ 
      //This is where my question refers to. 
      $('a#'+id+'.courseDel').click(); 
     } 
    }

कोई चेकबॉक्स जांच करता है, कुछ डेटा और लिंक के साथ एक अवधि पेज से जुड़ जाते हैं: मैं एक चेकबॉक्स है कि एक समारोह में कहा जाता add_course जो इस तरह दिखता है करने के लिए बाध्य कर रहा है। नई कड़ी के साथ

$('.courseDel').live('click', del_course);

del_course एक अलग समारोह से जुड़ा है बस add_course की तरह सामान की एक पूरी गुच्छा है,।

जैसा कि आप add_course फ़ंक्शन में देख सकते हैं। मैं जांचता हूं कि चेकबॉक्स चेक किया गया है और केवल तभी सामान किया गया है।

यहाँ

del_course है:

 function del_course(){ 
     var id = $(this).attr('id'); 
     $('#cn'+id).remove(); 
     $('#courseInput').val(function(index,value){ 
      return value.replace(id+',1;',""); 
     }); 
     subtractTotal($('#price'+id).text()); 
     imageSync(); 
    }

मैं अपने add_course समारोह के बाकी हिस्से के लिए संबंधित लिंक पर कि जब चेकबॉक्स चेक किया गया था जोड़ा गया के लिए del_course को गति प्रदान करना चाहते हैं। यह काम नहीं कर रहा है। मैं शायद जटिल कुछ पर है।

<span id="cn204"><a href="#" class="courseDel" id="204">X</a> Course Title<br/></span>

<input type="checkbox" class="courseAdd" name="courseAdd" id="204"/>

यहाँ लिंक जोड़ा जाता है कि के लिए एचटीएमएल है जब किसी एक चेकबॉक्स क्लिक करता है:

यहाँ चेकबॉक्स के लिए एचटीएमएल (उनमें से एक का एक उदाहरण है) जब कोई लिंक पर क्लिक करता है तो यह बहुत अच्छा काम करता है, लेकिन मैं इसे प्रोग्रामिक रूप से कैसे ट्रिगर करूं?

स्रोत

2011-10-21 lovefaithswing

2 आइटम यहाँ ध्यान दें: पहला, 'id' अद्वितीय, साझा नहीं की तरह तुम्हारे पास है और यह भी' आईडी और नाम टोकन एक पत्र के साथ शुरू होगा होना चाहिए ([a-zA-Z]) और हो सकता है किसी भी संख्या, अक्षरों ([0-9]), हाइफ़न ("-"), अंडरस्कोर ("_"), कोलन (":"), और अवधि ("।") के बाद हो। http://www.w3.org/TR/html4/types.html भी, http://stackoverflow.com/questions/70579/what-are-valid-values-for-the-id-attribute-in-html –

रीडिंग के बाद सवाल मुझे यकीन नहीं है कि मैं समझता हूं - आप इस पंक्ति के साथ क्या समस्या आ रही हैं: // यह वह जगह है जहां मेरा प्रश्न संदर्भित करता है। $ ('ए #' + आईडी + 'कोर्स कोर्स')। क्लिक करें(); – jbabey

जब से तुम तत्व आपके द्वारा बनाए गए की ID है, बस आईडी refernce और प्रयोग trigger() विधि

आईडी और नाम टोकन ([a-zA-z]) एक पत्र के साथ शुरू होगा और पत्र के किसी भी संख्या, अंकों ([0-9]), हाइफ़न ("-") के द्वारा पीछा किया जा सकता है, अंडरस्कोर ("_"), कोलन एस (":"), और अवधि ("।")।

स्रोत

2011-10-21 17:59:41

उल्लेख नहीं है कि उसके पास एक ही आईडी मान –

के साथ कई तत्व हैं, यह मुद्दा मेरे नामकरण सम्मेलनों के साथ था। – lovefaithswing

jquery's trigger() फ़ंक्शन का उपयोग करें। ,

$('#'+id).trigger('click');

इसके अलावा एक आईडी वह यह है कि सिर्फ एक नंबर गलत है:

$('.courseDel').trigger('click');

स्रोत

2011-10-21 17:56:03 jbabey

यह कक्षा 'कोर्स डेल' के साथ सभी एंकरों के क्लिक ईवेंट को ट्रिगर करेगा।मेरा मानना है कि ओपी एंकर की क्लिक इवेंट ट्रिगर करना चाहता है जो अभी जोड़ा गया था। –

लंबी अवधि में, यह आपके कोड को थोड़ा सा पुनर्गठित करने में मदद कर सकता है ताकि आप एप्लिकेशन तर्क से डीओएम ईवेंट-हैंडलिंग को रद्द कर सकें।

//Functions to add and remove stuff (these are *not* event handlers) 
//Since they now receive explicit parameters 
// you have full power over when to add and remove stuff and functions 
// can very easily call eachother if needed. 

//You can have any kind of state you might need, without having to 
//trick the dom into storing it for you: 
var currentlySelectedCourse = null; 

function add_course(id){ 
    //its now easy to access global state like the 
    //currently open course 
    //and it is now easy to call other functions like del_course 
} 

function del_course(id){ 
} 

//event handling can now become just a simple layer... 

$('.courseDel').live('click', function(){ 
    var id = //get the id or what parameters you need 
    del_course(id); //pass it to the backend function 
});

स्रोत

2011-10-21 18:06:43 hugomg

jquery प्रोग्रामेटिक रूप से नए डोम तत्व

उत्तर

संबंधित मुद्दे