मैं कुछ जावास्क्रिप्ट के साथ सरल HTML कोड है, यह की तरह लग रहा या "बी" रेडियो बटन, लेकिन div # सामग्री में जावास्क्रिप्ट विशेषता "मान" नहीं है, इसलिए मैं पूछ रहा हूं कि यह कैसे किया जा सकता है।HTML/जावास्क्रिप्ट परिवर्तन div सामग्री
मान लें कि आप jQuery या किसी अन्य लाइब्रेरी का उपयोग नहीं कर रहे हैं जो इस तरह की चीज आपके लिए आसान बनाता है, आप केवल तत्व की आंतरिक HTML प्रॉपर्टी का उपयोग कर सकते हैं।
document.getElementById("content").innerHTML = "whatever";
$('#content').html('whatever');
इसके लिए धन्यवाद replace_html का उपयोग करने का प्रयास कर रहा था, लेकिन यह मेरी समस्या को ठीक करने लग रहा था। कोई विचार क्यों? –
jQuery का उपयोग करना ... 5 साल देर से, कुछ भी नहीं बता रहा है और इसे इंगित किए बिना आवश्यक तकनीक का उपयोग नहीं कर रहा है ... फिर भी: 13 अपवॉट्स। मुझे समझ में नहीं आता है – jabujavi
div की आईडी जिनकी सामग्री आप तो बदल के रूप में नीचे पाठ प्रदान करना चाहते हैं प्राप्त करें:
var myDiv = document.getElementById("divId");
myDiv.innerHTML = "Content To Show";
स्टैक ओवरफ्लो में आपका स्वागत है! जब आप अपने कोड में लिखते हैं तो थोड़ा सा स्पष्टीकरण प्रदान करते हैं जवाब सिर्फ कोड से कहीं ज्यादा उपयोगी है। –
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<input type="radio" name="radiobutton" value="A" onclick = "populateData(event)">
<input type="radio" name="radiobutton" value="B" onclick = "populateData(event)">
<div id="content"></div>
</body>
</html>
----------- ------ JS- कोड ------------
var targetDiv = document.getElementById('content');
var htmlContent = '';
function populateData(event){
switch(event.target.value){
case 'A':{
htmlContent = 'Content for A';
break;
}
case 'B':{
htmlContent = "content for B";
break;
}
}
targetDiv.innerHTML = htmlContent;
}
Step1: on click of the radio button it calls function populate data, with event (an object that has event details such as name of the element, value etc..);
Step2: I extracted the value through event.target.value and then simple switch will give me freedom to add custom text.
लाइव कोड
एक तरफ ध्यान दें पर, 'document.getElementById (" सामग्री ")। InnerText =" बोल्ड पाठ? ";' document.getElementById ("सामग्री") के लिए अलग-अलग, और कभी-कभी काफी उपयोगी व्यवहार करेगा। आंतरिक HTML = "बोल्ड टेक्स्ट? ";' – Isaac
कृपया 'आंतरिक टेक्स्ट' और 'टेक्स्टकंटेंट' की बजाय 'आंतरिक HTML' का उपयोग करें क्योंकि' आंतरिक HTML' सभी ब्राउज़रों के अनुकूल है। –