जेएस या जेक्री अद्वितीय स्पैन आईडी

Question

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

ली ऑब्जेक्ट निर्माण:

$("#jdLists").append('<li class="bigger" id = "' + item.ID + '">'+ 
    item.GROUP_NAME + 
    '<span title="Remove from list" class=" Sp icon icon-color icon-plus" style="float: right; vertical-align: middle;" '+ 
    'onclick="spAdd()"></span>' + 
    '</li>'); 

क्लिक समारोह पर:

function spAdd() { 
    $(this).closest("li").attr('id'); 
} 

Answer 1

इस तरह का प्रयास करें:

// Should work for most cases 
function uniqId() { 
    return Math.round(new Date().getTime() + (Math.random() * 100)); 
} 

// Create elements properly and attach click event 
// before appending to DOM so it delegates the event 
var $li = $('<li/>', { 
    'class': 'bigger', 
    id: uniqId() 
}); 

var $span = $('<span/>', { 
    'class': 'Sp icon icon-color icon-plus', 
    title: 'Remove from list', 
    text: 'I\'m a span', 
    click: function() { 
    alert($(this).parent().attr('id')); 
    } 
}); 

$('#jsLists').append($li.append($span)); 

यह क्लिक पर ली के यादृच्छिक आईडी सचेत करना चाहिए। इनलाइन सीएसएस के बजाय, उन शैलियों के लिए एक और कक्षा जोड़ें; बेहतर, सरल, आसान।

डेमो:http://jsbin.com/avevim/1/edit

Answer 2

अंडरस्कोर इस तरह के मामलों के लिए एक uniqueId समारोह प्रदान करता है (Ctrl + ताज़ा और नए आईडी प्राप्त करने के लिए दर्ज करें)। तिथियों और यादृच्छिक संख्याओं के साथ मुश्किल होने की बजाय, यह केवल वैश्विक काउंटर रखता है और प्रत्येक बार फ़ंक्शन कहलाता है:

var idCounter = 0; 
_.uniqueId = function(prefix) { 
    var id = '' + ++idCounter; 
    return prefix ? prefix + id : id; 
};