शुद्ध जे एस विकल्प डेटा चयनित हो मूल्य अशक्त

Question

रिटर्न का श्रेय मैं इस एचटीएमएल है:

<select onchange="check_status(this);" name="status[171]">  
    <option selected="true" value="open" data="04f2cf35e4d7a1c0158459fd0450a605">open</option>  
    <option value="in_process" data="04f2cf35e4d7a1c0158459fd0450a605">pending</option>  
    <option value="finished" data="04f2cf35e4d7a1c0158459fd0450a605">finished</option>  
    <option value="canceled" data="04f2cf35e4d7a1c0158459fd0450a605">canceled</option>  
</select>  

और जे एस

function check_status(obj){  
    var uid = obj.getAttribute('data'); 
    alert(uid); 
} 

लेकिन यह हमेशा डेटा मान कहाँ समस्या लोग है के बजाय अशक्त अलर्ट? धन्यवाद

Answer 1

समस्या यह है कि आप कुछ चुनिंदा तत्व और समारोह तर्क के रूप में नहीं चयनित विकल्प तत्व प्राप्त है।

function check_status(obj) { 
 
    var uid = obj.options[obj.selectedIndex].getAttribute('data'); 
 
    alert(uid); 
 
}

<select onchange="check_status(this);" name="status[171]"> 
 

 
    <option selected="true" value="open" data="04f2cf35e4d7a1c0158459fd0450a605">open</option> 
 
    <option value="in_process" data="04f2cf35e4d7a1c0158459fd0450a605">pending</option> 
 
    <option value="finished" data="04f2cf35e4d7a1c0158459fd0450a605">finished</option> 
 
    <option value="canceled" data="04f2cf35e4d7a1c0158459fd0450a605">canceled</option> 
 
</select>

Answer 2

आप चुनिंदा डेटा विशेषता प्राप्त करने का प्रयास कर रहे हैं, न कि विकल्प।

इसके अलावा, मैं देख सकता हूं कि आप सभी data विशेषताएँ समान हैं। फिर आप इसे चुनने के लिए विकल्प से स्थानांतरित कर सकते हैं: <select onchange="check_status(this);" name="status[171]" data="04f2cf35e4d7a1c0158459fd0450a605" > और अपने प्रश्न से छीनने वाले कोड का उपयोग अनमोडिफाइड करें।

function check_status(obj) { 
 
    var uid = obj.options[obj.selectedIndex].getAttribute('data'); 
 
    alert(uid) 
 
}

<select onchange="check_status(this);" name="status[171]"> 
 
    <option selected="true" value="open" data="open04f2cf35e4d7a1c0158459fd0450a605">open</option> 
 
    <option value="in_process" data="pending104f2cf35e4d7a1c0158459fd0450a605">pending</option> 
 
    <option value="finished" data="finished04f2cf35e4d7a1c0158459fd0450a605">finished</option> 
 
    <option value="canceled" data="canceled04f2cf35e4d7a1c0158459fd0450a605">canceled</option> 
 
</select>

Answer 3

function check_status(obj){  
    var uid = obj.options[obj.selectedIndex].getAttribute('data'); 
    alert(uid); 
} 

Answer 4

आप कस्टम "डाटा" विशेषता का उपयोग विशेषताओं को परिभाषित। आपके कोड में, custome विशेषता नहीं है जो मुझे यकीन है कि आप इसे एक आईडी होना चाहते हैं। सटीक प्रारूप "data-*" है, जहां "*" वांछित कस्टम विशेषता नाम के साथ प्रतिस्थापित किया गया है, फिर वांछित स्ट्रिंग मान पर सेट करें। तो आपके कोड में, यह आदर्श होना चाहिए:

<select onchange="check_status(this);" name="status[171]"> 
    <option selected="true" value="open" data-id="open04f2cf35e4d7a1c0158459fd0450a605">open</option> 
    <option value="in_process" data-id="pending104f2cf35e4d7a1c0158459fd0450a605">pending</option> 
    <option value="finished" data-id="finished04f2cf35e4d7a1c0158459fd0450a605">finished</option> 
    <option value="canceled" data-id="canceled04f2cf35e4d7a1c0158459fd0450a605">canceled</option> 
</select> 

मानते हुए कि आप कस्टम विशेषता "आईडी" होना चाहते हैं।

आप दो तरह से "डाटा" का मान प्राप्त कर सकते हैं शुद्ध जावास्क्रिप्ट का उपयोग गुण: अच्छे पुराने फैशन प्राप्त/setAttribute(), आप भी तत्व की "डाटासेट" संपत्ति का उपयोग कर उपयोग कर सकते हैं के अलावा

डोम के getAttribute() संपत्ति

function check_status(obj) { 
     var myoption = obj.options[obj.selectedIndex]; 
     var uid = myoption.getAttribute('data'); 
     alert(uid); 
     // setting and removing the data-id attribute 
     myoption.setAttribute("data-id", "foo") //changes "data-id" to "foo" 
     myoption.removeAttribute("data-id") //removes "data-id" attribute entirely 
} 

का उपयोग Btw जावास्क्रिप्ट का डाटासेट संपत्ति

function check_status(obj) { 
     var myoption = obj.options[obj.selectedIndex]; 
     var uid = myoption.dataset.id; 
     alert(uid); 
     var statusId = myoption.dataset["id"] 
     alert(statusId); 
}