- Megérkezett a Phanteks új mikrotornya, akár kábeleket rejtő alaplapokhoz is
- Jövőre veti be az FSR 4-et a Sony a PlayStation 5 Pro konzolon
- Angol futball: 30 szezon statisztikáiból gyűjt érdekességeket a Microsoft AI
- Kifarolhat az üvegszubsztrátumok piacáról az Intel
- Magas AI-költségek, csökkenő létszám: dolgozók ezreit rúgja ki a Microsoft
- Házimozi haladó szinten
- Hobby elektronika
- Milyen processzort vegyek?
- Intel Core i3 / i5 / i7 / i9 10xxx "Comet Lake" és i3 / i5 / i7 / i9 11xxx "Rocket Lake" (LGA1200)
- Milyen asztali (teljes vagy fél-) gépet vegyek?
- Fejhallgató erősítő és DAC topik
- Androidos tablet topic
- Azonnali VGA-s kérdések órája
- HiFi műszaki szemmel - sztereó hangrendszerek
- AMD Ryzen 9 / 7 / 5 7***(X) "Zen 4" (AM5)
-
PROHARDVER!
JavaScript != Java (A JavaScript nem összekeverendő a Javával, két különböző programozási nyelvről van szó!)
Új hozzászólás Aktív témák
-
btz
addikt
Illetve azt sem vártam el senkitől sem itt, sem máshol, hogy hűde sürgösen helyettem rakjon össze egész weboldalakat, így ezt az atomerőműves példát sem tudom behelyettesíteni az én esetemre.
Nekem bőven az is elég ha támpontot ad valaki egy egy problémára, (ahogy például te is tetted a fenti DOM Content Loadedes példával, ami sajnos nem hozott eredményt ugyan, illetve már a kérdés feltevése előtt is próbálkoztam vele, mégis hasznos megközelítése a segítségnyújtásnak). Nem várom el senkitől hogy helyettem dolgozzon,helyettem írja meg a kódot. Szóval úgy gondolom rosszul látod a dolgot. -
btz
addikt
válasz
martonx
#7956
üzenetére
Nem értem teljesen a mondandód lényegét. Jól működő kódokkal minek jönnék a fórumra? Egy fórumra általában nem működő, nem jól működő kóddal, vagy valamilyen problémával szoktak jönni az emberek. Olyan példával jöttem ide, ami szemlélteti a problémám jellegét, így könnyebben meg tudom rá kapni a választ. Ez meg is történt. Siker. Keresgéltem is a probléma miatt nem keveset, többek között az általad javasolt [DOMContentLoaded] - el is próbálkoztam sikertelenül. Szóval nem látod jól, hogy 0 időt fektetek bele. Nem sok időm van rá ez tény, de szánok a dologra időt azért.
Nem érzem úgy hogy itt akarom megtanulni a programozás alapjait, de én úgy látom, hogy rengeteget tanulok egy egy probléma megoldásából. Ha lesz rá keret és idő, akkor majd elvégzek valamilyen tanfolyamot, mert amúgy érdekel a dolog, mégha néha úgy is jön le, hogy csak kényszerűségből foglalkozom ezzel.
Azzal pedig nem értek egyet, hogy én itt bárkivel atomerőművet szeretnék építetni. Ha így lenne akkor nem példakódot készítettem volna a problémámról, hanem kiírtam volna, hogy "légyszives rakjátok már össze az egész oldalamat A-Z-ig Kösz" Nem emlékszem, hogy ilyennel jöttem volna itt bármikor is.
Ha mindenki értene mindenhez, akkor nem lenne szükség a fórunokra, mert mindenkinek meg lenne oldva a problémája. Maximum arról lehetne diskurálni, hogy a mai nap is milyen könnyen ment, nem volt probléma egy szál se. -
btz
addikt
válasz
martonx
#7954
üzenetére
Szerintem pedig belefér a fórum keretei közé egy egy probléma JavaScriptel való megoldása. A programozás is azért van, hogy problémát oldjon meg, nem önmagában azért, hogy az unalmas perceinket ezzel töltsük ki.
Én úgy érzem, hogy hogy lehet így is megtanulni a dolgot, problémák megoldása közben. Hidd el, hogy az elmúlt pár hónapban mióta komolyabban foglalkozom programozással, nagyon sokminden megértettem megtanultam, nem csak a kosz ragadt rám.
A fenti példából is sokat tanultam és utána is olvastam pár dolognak. Nem ezzel foglalkozom napi 8 órában, nem ez a fő profilom, így idő hiányában lassabban haladok, mint ha egy tanfolyamon napi 8 órában, vagy a teljes munkaidőmben ezzel tudnék foglalkozni
Sajnos a jelenlegi gazdasági helyzetben nem fér bele százezrek kiadása tanfolyamokra, szakértőkre. Abból kell gazdálkodni ami van. -
btz
addikt
Amúgy ha akarok több .html fájlt is beszúrni akkor mindegyik elé kell egy callback konstans?
<script>
const callback = () => {
....
};
includeHTML("content.html", "content", callback);
const callback2 = () => {
....
};
includeHTML("content2.html", "content2", callback2);
</script> -
btz
addikt
Igazából nem az én kódomhoz lesz ez és nem is ez az eredeti éles kód. Amit ide kiraktam kódot az csak tesztelés céljából van. Akiknek kell a megoldás, azok szakvámban a w3school.com scriptjét használják, ezért úgy voltam vele, hogy ahol csak lehet, "nem bántom az alapkódot" elvet követem. Közben jött pár megoldás, amivel megkaptam amire vágytam, nem kellett pluszban átírni a w3scool scriptet, mindenki happy volt, amíg fel nem merült az igény, hogy az oldal betöltésekor is ez az amaz jelenjen meg az includeolt oldalrészen is, eközben ez a megoldás ki is ment a fejemből, de most forkoltam a kódod, így biztos helyen van
Sajnos nem lesz megúszva a w3 kód átalakítás 
Köszi a segítséget -
btz
addikt
[HTML beágyazott kód QuerySelector működés]
Közben felmerült a kérdés, hogy ha a content.html output2 elemébe nem klikk eseménykor, hanem betöltéskor, akarok berakni valamit, akkor azt hogyan tehetem meg. Sajnos csak ilyen csúnya megoldás jutott eszembe:
setTimeout(function() {
var output2var = document.getElementById("output2");
output2var.innerHTML = "OUTPUT2 IS WORKING";
}, 1000);Azaz setTimeoutal megvárom a teljes betöltést. Elég gány.
-
btz
addikt
Üdv!
Random számokat szeretnék kiíratni X darabot, de azt szeretném, hogy az X darabon belül ne legyen kétszer ugyan az a szám kiírva. Mondjuk ha az 5 egyszer már volt, akkor az ne legyen mégegyszer abban a körben. Ha mondjuk a random csak 0-9 ig terjedő számok közül választhat, de X 15-el egyenlő, azaz 15 darab kellene, akkor is csak 10 szám legyen random sorban (a nullával együtt ugye), azaz a fontosabb prioritás az legyen, hogy ne ismétlődjön egy körben a random szám, mintsem az X értéke. -
btz
addikt
"Ezt alapvetően én nem nagyon ajánlanám, jobb az, ha az egyes event listener-eknek csak akkor futnak le, ha szükséges"
Értem, és milyen módosításokat tudnék elvégezni ebben a helyzetben, tehát csak akkor fusson amikor szükséges, ne minden esetben? Talán szűkítsem le egy adott ID-vel rendelkező divre? Viszont akkor működni fog?
''a JavaScript event capure mechanizmusa"
Köszi. Megpróbálom elolvasni és értelmezni
-
btz
addikt
Közben másik fórumon sikerült megoldani a problémát.
Ez az eredeti nem működő kód CODESANDBOX
Az ebben lévő addEventListener nem tudta elérni a #testclick ID-jű elemet.
<script>
let output = document.querySelector("#output");
let testclick = document.querySelector("#testclick");
testclick.addEventListener("click", testclickevent());
function testclickevent() {
output.innerHTML = "TEST CLICK IS WORKING";
}
</script>Ebben az alábbi kód szerepel
<script>
document.addEventListener("click", function(e) {
var elem = e.target;
if (elem && elem.id == "testclick") {
output.innerHTML = "THIS SOLUTION IS WORKING";
}
});
</script>
Teljesen még nem tiszta, hogyan is képes látni ez a content.html-ben lévő button ID-t, de működik. Gombnyomásra kiírja, hogy "THIS SOLUTION IS WORKING"
-
btz
addikt
Üdv
Ezzel a w3-as módszerrel van beillesztve html a html-be. Ez működik is remekül, kivéve, hogy addEventListener-el szeretnék a content.html fájlban egy click vagy change eventre funkciót, az nem reagál. Ha a content.html fájlt önmagában (direktben) megnyitom, akkor működik, reagál a kattintásra és az select mező cseréjére is.
Példakódot délután majd rakok fel.
Szerintetek mi lehet a gond? Találkoztatok e már hasonló problémával? -
-
btz
addikt
var height = 200;
var height250 = 200+250;
var x = `'${height250}px'`;
var x = '450px';
document.getElementById('demo').style.paddingTop = x;Ha az alsó var x-et használom, beállítja demo element paddingtop-ját 450px-re , ha kikommentelem az alsó var x = ''450px'-et, akkor nem. Pedig a felső var x értéke ugyan az kell, hogy legyen.
-
btz
addikt
Van X db képem. A példában most legyen 1538, és ezt Y darabszámban szeretném megjeleníteni. A példában legyen ez 200.
var allpicture = 1583;
var pictureperpage = 200;
var actualpage = 1;Készítettem egy változót ami kiszámolja, hogy hány lapon fér el X kép:
var totalpage = Math.ceil(allpicture / pictureperpage);Mi az első és utolsó kép száma az N. lapon.
if (actualpage == 1) { var firstpiconpage = 1; } else {
var firstpiconpage = ((actualpage - 1) * pictureperpage) + (actualpage - 1); }
if (actualpage == 1) { var lastpiconpage = firstpiconpage + (pictureperpage-1); } else {
var lastpiconpage = firstpiconpage + pictureperpage;
}
if (firstpiconpage > allpicture) { var firstpiconpage = allpicture; }
if (lastpiconpage > allpicture) { var lastpiconpage = allpicture; }Kérdésem a szokásos. Van e valamilyen forumla, amivel egyszerűbb lehet a kód?
JSFiddle DEMO -
btz
addikt
Hát ez tényleg "easy" megoldás volt.
Még annyit változtattam rajta, hogy ezt
const editbuttons = document.querySelectorAll('.x > button');
kicseréltem erre:const editbuttons = document.querySelectorAll('.editbuttons');
így az egész az class x div-től is független lesz, akár el is hagyható lenne.Köszönöm a gyors bugfixet
-
btz
addikt
Igen ezzel csökken az a terület, ami undefinedet ad, de magára az ikonos részre kattintva továbbra is undefined. De ha például nem is kell majd valahol szöveg, csak az ikon a gombon?
De úgy néz ki, hogy a régi tradicionális módszer esetén nem lenne gond.
-
btz
addikt
Sziasztok!
Ismét egy Javascript probléma. (Ezzel mindig csak probléma van, de az is lehet hogy csak velem
)Jim-Y által ajánlott querySelectoros kódból szeretnék Camera Name/Path editort.
A gombokon FontAwesome edit ikont használnék. A probléma az vele, hogyha rákattintok, akkor csak magára a gombra kattintva jelenik meg a popupban az adat, ha az ikon részre kattintok, akkor undefined-et kapok.
Az első gombnál megcsináltam, hogy a "data-...." infókat beletettem a buttonon kívül az <i> tagbe is, így:<button class="buttonact yellowbtn editbuttons" data-camNum="A" data-camId="1" data-camName="CAMERA1" data-camPath="/CM/PATH1/">
<i data-camNum="A" data-camId="1" data-camName="CAMERA1" data-camPath="/CM/PATH1/" class="fa fa-pencil-square-o" style="font-size:20px">CAM1</i>
</button>
De ezzel duplikálni kell a sorokat.
Ide kattintva jó...
Ide kattintva undefined....(B)JSFiddle DEMO(/B)
-
btz
addikt
-
btz
addikt
Biztos erre is van szebb kód, ami nem anti-pattern és 2020-ban is megállja a helyét:
Kiválasztott checkbox elemek kiíratása. A példakódban Alert-be és Console.log-ba
A kiválasztott elemeket vessző, majd szóköz választja el a megjelenített ablakban, de az utolsó elemnél is megjelenik ez a vessző és szóköz, ami nem kell. Ezt úgy oldottam meg, hogy a kapott elemlista stringből levágok két karaktert, ami a vessző és a szóköz.function printChecked(){
var items=document.getElementsByName('acs');
var selectedItems="";
for(var i=0; i<items.length; i++){
if(items[i].type=='checkbox' && items[i].checked==true)
selectedItems+=items[i].value+", ";
}
var str = selectedItems.substring(0, selectedItems.length - 2);
alert(str);
console.log(str);
} -
btz
addikt
válasz
martonx
#7878
üzenetére
"jsfiddle-nek a html részébe erőltetted bele a javascriptet
"Merő lustaság, ahogy az inline style és a <br /><br /> is. Sorry
"Aztán a js-ben dataset-et nem használtad jól."
Datasetet? Úgy tudom azt én nem is használtam az első verziós kódban. Vagy de?
" klasszikus es5 ...Béna metódus elnevezés (MyFunction WTF?) "
Hallottam már valamit ES6-ról de lövésem sincs amúgy mi az, ennek utána kéne olvasnom.
Tutorialokat olvasgatva férceltem össze a kódot. És amikor ilyeneket csinálok, akkor meghagyom az eredeti elnevezéseket, amíg mással nem ütközik. Amúgy sok netes tutorialban a myFunction() elnevezést használnak a példakódban. Nem én találtam ki."minden sornál meg lehetett volna állni, és kifejteni, hogy mi miért nem jó"
Természetesen minden új infót szívesen veszek (mi miért nem jó, hogy lehetne jobb), mert abból tudok tanulni és fejlődni. Nem végzek semmilyen webfejlesztői sulit, a netről szedem össze a tudást, ami néha nem biztos hogy a jó irányba visz, épp ezért vagyok ezen a fórumon is, mert itt vannak a témában tapasztaltabb fórumozók.
-
btz
addikt
Üdv!
Állásinterjúra szerencsére nem kell mennem ezzel, mert van jelenleg (nem programozás). Csak saját jellegű projektekhez van szükségem némi Javascript tudásra (aztán ki tudja, hogy később hol veszem hasznát még)
Ettől függetlenül köszi az építő jellegű kritikát és tanácsokat -
btz
addikt
válasz
martonx
#7873
üzenetére
Például a nagy kék felugró boilerplate bar miatt (Talán csak a GDPR felugrók az idegesítőbbek nála), a becsukhatatlan menük miatt (Egy kódokkal foglalkozó oldalon ilyen?) stb... Volt egyszer olyan nyűgje is hogy teljesen kifagyasztotta a gépet mikor a forkra kattintottam egy kódnál (De legalább ez már jó). Mobileszközön egy az egyben használhatatlan.
A codepent viszont jobban szeretem, de igazából a böngésző ablakot preferálom. Kódot mutogatni viszont végül is mindegy, hogy melyiket használja az ember."A kódod egyébként borzalmas"
Pontosan mi az ami borzalom rajta? Formailag oké, ezt most csak így összedobtam, de van esetleg más borzalom is benne?
-
btz
addikt
válasz
martonx
#7870
üzenetére
Az oké is volt számomra, ez a link már a könyvjelzőim között volt modal témában, de nekem pontosan az kellett, hogy a benne lévő input értékek a data szertint változzanak. Erre találtam, is megoldást JQueryset, de mivel kerülöm ezért akartam simple Javascriptesíteni.
De időközben rajta voltam a témán és ezt sikerült megalkotnom
<button onclick="myFunction(this)" data-book-id="123" data-book-name="Test Book 1">Open Popup Book1</button><br />
<button onclick="myFunction(this)" data-book-id="456" data-book-name="Test Book 2">Open Popup Book2</button><br />
<button onclick="myFunction(this)" data-book-id="789" data-book-name="Test Book 3">Open Popup Book3</button><br />
<br /> <br />
<script>
function myFunction(thisbook) {
var bkID = thisbook.getAttribute("data-book-id");
var bkNam = thisbook.getAttribute("data-book-name");
document.getElementById("myBookId").value = bkID;
document.getElementById("myBookName").value = bkNam;
document.getElementById("book-update-popup").style.display = "block";
}
function closeBookModal() {
document.getElementById("book-update-popup").style.display = "none";
}
</script>
<div id="book-update-popup" style="display: none; margin: 5px; padding: 10px; border: 1px solid;">
BookID: <input type="text" id="myBookId" value="">
BookName: <input type="text" id="myBookName" value="">
<br /><br />
<button onclick="closeBookModal()">Close</button><br />
</div> -
btz
addikt
Üdv!
Van egy <a> link,aminek van két data értéke bookID és bookName. Erre rákattintva egy felugró ablak megjelenik az adott értékekkel. JQuery-s megoldásom van, de érdekelne, hogy simple Javascriptel meg lehet e oldani? Mindenhol ahol keresgéltem, csak Jquery-s megoldások vannak.
-
btz
addikt
Ah, már értem.
Így már működik, viszont ha kétszer nyomok rá a startra, akkor nem.
https://www.w3schools.com/code/tryit.asp?filename=GENNT2VVWKHFPersze csinálhatnám azt, hogy első klikkre elrejtem a start gombot, de érzem én hogy az nem elegáns módszer.
-
btz
addikt
Úgy érted, hogy funkción kívül? De akkor meg nem lesz start funkcióm.
Egy másik példa:
Ha nem funkcióban van a változó, akkor megy:
https://www.w3schools.com/code/tryit.asp?filename=GENNHPYKDWURÍgy viszont már nem:
https://www.w3schools.com/code/tryit.asp?filename=GENNKLS0GE1L -
btz
addikt
Üdv!
Van egy modal.js-em. Nem akar stoppolódni!...
function startCallback() {
var startCB = window.setInterval(myCallback, 500, -1);
}
function stopCallback() {
console.log('TRY TO STOP');
window.clearInterval(startCB);
console.log('STOPPED');
}
function myCallback(a)
{
plusSlides(a);
}
...Start onclickre el kezdi cserélni a képeket a slider, de stopra ezt a hibát kapom:
modal.js:44 Uncaught ReferenceError: startCB is not defined
at stopCallback (modal.js:44)
at HTMLAnchorElement.onclick -
-
btz
addikt
Nos. Végre megy. Kitöröltem a számomra felesleges sallangokat. Létrehoztam egy copy funkciót és egy Copy Buttont:
<html>
<body>
<div id="mainContent">
MAIN CONTENT<br />
</div>
<br />
<button id="btnCopy">COPY</button>
<script type="text/javascript" >
// Create a fake textarea
const textAreaEle = document.createElement('textarea');
var text = "tesztszöveg 3333";
// Set the value
textAreaEle.value = text;
// Append the textarea to body
document.getElementById("mainContent").appendChild(textAreaEle);
btnCopy.onclick = function () {
textAreaEle.select();
textAreaEle.focus();
document.execCommand('copy');
};
</script>
</body>
<html>Aztán az eredeti saját kódomat így módosítottam:
</head>
<body>
<b>AZ EMBED kód előnézete:</b><br />
<iframe src="https://parentdomain.com/embed/id" id="iframe" name="iframe" scrolling="no" frameborder="0" style="width: 100%; height: 600px;"></iframe>
<br /><br />
<div id="myDiv">0</div>
<script type="text/javascript" >
function receiveMessage(event) {
var ifrheig = (event.data.v1) + 'px';
document.getElementById("iframe").style.height = ifrheig;
var v1data = (event.data.v1);
var textNode = document.createTextNode(v1data);
document.body.appendChild(textNode);
var toCopy = '<iframe src="https://parentdomain.com/embed/id" id="iframe" name="iframe" scrolling="no" frameborder="0" style="width: 100%; height: ' + v1data + 'px;"></iframe>';
var innertomydiv = '<b>Embed kódja:</b><textarea rows="5" style="width: 100%;" type="text" id="code" name="code">' + toCopy + '</textarea><button id="btnCopy"><b>COPY</b></button>';
document.getElementById("myDiv").innerHTML = innertomydiv;
btnCopy.onclick = function () {
document.getElementById("code").select();
document.getElementById("code").focus();
document.execCommand('copy');
};
}
window.addEventListener("message", receiveMessage, false);
</script>
</body></html>Így a böngészőben megjelenik az Embed előnézete, alatta egy Textarea mezőben az Iframe kód (Jobb mint az input mező) a magassági értékkel, egy működő Copy gomb, ami vágólapra másolja a Iframe embed kódot, végül teszt gyanánt a magassági érték, de ez a publikus kódban már nem lesz benne.
-
btz
addikt
Ezt próbálgattam már. Nálam nem működik (szokás szerint)
Először így próbáltam:
<script type="text/javascript" >
// Create a fake textarea
const textAreaEle = document.createElement('textarea');
// Reset styles
textAreaEle.style.border = '0';
textAreaEle.style.padding = '0';
textAreaEle.style.margin = '0';
// Set the absolute position
// User won't see the element
textAreaEle.style.position = 'absolute';
textAreaEle.style.left = '-9999px';
textAreaEle.style.top = `0px`;
// Set the value
textAreaEle.value = text;
// Append the textarea to body
document.body.appendChild(textAreaEle);
// Focus and select the text
textAreaEle.focus();
textAreaEle.select();
// Execute the "copy" command
try {
document.execCommand('copy');
} catch (err) {
// Unable to copy
} finally {
// Remove the textarea
document.body.removeChild(textAreaEle);
}
</script>Ekkor a textAreaEle.value = text; érték nem volt definiálva így készítettem neki egy változót. var text = "tesztszöveg";
<script type="text/javascript" >
// Create a fake textarea
const textAreaEle = document.createElement('textarea');
// Reset styles
textAreaEle.style.border = '0';
textAreaEle.style.padding = '0';
textAreaEle.style.margin = '0';
// Set the absolute position
// User won't see the element
textAreaEle.style.position = 'absolute';
textAreaEle.style.left = '-9999px';
textAreaEle.style.top = `0px`;
var text = "tesztszöveg";
// Set the value
textAreaEle.value = text;
// Append the textarea to body
document.body.appendChild(textAreaEle);
// Focus and select the text
textAreaEle.focus();
textAreaEle.select();
// Execute the "copy" command
try {
document.execCommand('copy');
} catch (err) {
// Unable to copy
} finally {
// Remove the textarea
document.body.removeChild(textAreaEle);
}
</script>Hiba: Uncaught TypeError: Cannot read property 'appendChild' of null.
Beraktam bodyba a scriptet, utána semmit nem csinált, viszont a hiba megszűnt.
Aztán a document.body részt cseréltem document.getElementById("mainContent").appendChild(textAreaEle);-re. Így már megjelenik a textarea, benne a tesztszöveg felirattal. (A kódból kitöröltem azt a részt ami elrejti a textarea-t).<html>
<body>
<div id="mainContent">
MAIN CONTENT<br />
</div>
<script type="text/javascript" >
// Create a fake textarea
const textAreaEle = document.createElement('textarea');
var text = "tesztszöveg";
// Set the value
textAreaEle.value = text;
// Append the textarea to body
document.getElementById("mainContent").appendChild(textAreaEle);
// Focus and select the text
textAreaEle.focus();
textAreaEle.select();
// Execute the "copy" command
try {
document.execCommand('copy');
} catch (err) {
// Unable to copy
} finally {
// Remove the textarea
//document.body.removeChild(textAreaEle);
}
</script>
</body>
<html>Viszont nem másol semmit a vágólapra.
-
btz
addikt
válasz
sztanozs
#7852
üzenetére
Nem bele szeretném, hanem mellé helyezni. Az első Iframe a megjelenítési minta. Tehát az user ebből látja, hogy fog kinézni a kód eredménye, amit az inputból kimásol.
Az input azért kell, hogy a felhasználó könnyen ki tudja jelölni és másolni belőle az Iframe kódot, majd azt beilleszteni máshová, például a saját weboldalába, a megfelelő magassági értékkel együtt. Ekkor már a JavaScript-et el is hagyhatja, mivel olyan Iframe kódot másol ki, ami tartalmazza az Iframe contentjének magasságát. De ez nem is kéne, ha valahogy találnék egy lehetőséget gombnyomásra be másolni az user vágólapjára az Iframe kódot. Mivel ez a cél, hogy az user könnyedén copyzza. -
btz
addikt
válasz
sztanozs
#7848
üzenetére
Pontosan hogy is tudnám a "var innertomydiv" változómat végigfuttatni ezzel? Bocsi, de én már hosszú ideje kezdő vagyok Javascriptben, így ez egy kicsit magas, hogyan is tudnám ezt alkalmazni, de akár az előző BA változós példához is jó lenne, tudnom, hogyan is varázsolhatom bele, illetve hogyan nyerhetem ki, mondjuk egy új változóban?
Emoik nem lesznek benne, csak a példában is látott input mező benne az input mezőben lévő iframe html kód a magassági értékkel együtt ami a v1data változóban van tárolva.
var innertomydiv = '<input style="width: 100%;" type="text" id="frame" name="frame" value="<iframe src='https://website.com/embed/id' id='iframe' name='iframe' scrolling='no' frameborder='0' style='width: 100%; height: ' + v1data + ';'></iframe>">';UPDATE:
A kimásolandó kód értékét elrontottam, mert id="iframe" name="iframe" helyett csak id="frame" name="frame" van az input mezőben.Amúgy az még jobb lenne, ha valami buttonnal az egész értéket a vágólapra is lehetne tenni. Ennek még utánanézek.
-
btz
addikt
válasz
sztanozs
#7847
üzenetére
Sikerült megoldanom a problémámat, részben a segítségeddel, mivel rájöttem, hogy amit akarok az az inner.HTML-el is megoldható. Ismertem amúgy ezt a lehetőséget, de nem akartam használni, mivel ala nature szerettem volna kiíratni, mert bele akartam rakni egy input mező value értékébe. Ekkor villant be hogy mért ne csinálhatnám az egész input mezőt az innerHTML-el?
A https://website.com/embed/id oldalon ez a script leméri az "all" div magasságát.
<script>
var element = document.getElementById('all');
var magassag = (element.offsetHeight);
var MYGLOBAL = (element.offsetHeight) + 10;
//window.parent.postMessage(['varA', MYGLOBAL], '*');
parent.postMessage({v1: MYGLOBAL}, "*");
</script>Azon az oldalon ahol a https://website.com/embed/id be van szúrva IFRAME ként:
<html lang="en"><head>
<meta charset="utf-8">
<title>EMBED TESZT</title>
</head>
<body>
<iframe src="https://website.com/embed/id" id="iframe" name="iframe" scrolling="no" frameborder="0" style="width: 100%; height: 600px;"></iframe>
<br /><br />
<div id="myDiv">0</div>
<script type="text/javascript" >
function receiveMessage(event) {
var ifrheig = (event.data.v1) + 'px';
document.getElementById("iframe").style.height = ifrheig;
var v1data = (event.data.v1);
var textNode = document.createTextNode(v1data);
document.body.appendChild(textNode);
var innertomydiv = '<input style="width: 100%;" type="text" id="frame" name="frame" value="<iframe src='https://website.com/embed/id' id='iframe' name='iframe' scrolling='no' frameborder='0' style='width: 100%; height: ' + v1data + ';'></iframe>">';
document.getElementById("myDiv").innerHTML = innertomydiv;
}
window.addEventListener("message", receiveMessage, false);
</script>
</body></html>1. Megjelenik az iFrame kezdetben 600px magassággal.
2. Kezdetben a myDiv értéke nulla.
3. A scriptben a receiveMessage funkcióval lekérem a CHILD oldal var MYGLOBAL = (element.offsetHeight) + 10; értékét ami a szülő oldalon van, beleteszem az egészet egy "ifrheig" nevű változóba és ezzel már be tudom állítani az Iframe magasságát (+10px ráhagyás, de ez már a "CHILD" oldali MYGLOBAL értékben alapból benne van)
4. v1data változóba téve ismét lekérem a MYGLOBAL értékét (event.data.v1) amit textNode-ként ki lehet íratni az aktuális helyen. Arra gondoltam, hogy majd ezt teszem bele egy input mezőbe magasságértékként az Iframe kódjával együtt, így majd az user már a kellő magassági értékkel együtt tudja kimásolni azt, nem kell pluszban a scriptkódot is kimásolni , hogy a megfelelő magasságot kapja.
5. Aztán rájöttem, hogy az egészet egy innertomydiv változóval beleíratom input mezőstől a második pontban említett myDiv-be. Így a pléda Iframe alatt megjelenik egy input mezőben az iFrame html kódja, amit könnyen kimásolhat az user és beilleszthet akárhova a megfelelő mérettel. -
btz
addikt
Így már sikerül továbítani a variablet, de az egész oldalt felülírja
Ez van az IFRAME-lendő oldalban.
var MYGLOBAL = 'MYGLOBAL okkéé';parent.postMessage({v1: MYGLOBAL}, "*");Ez pedig abban, amiben az Iframe is
<iframe src="https://weboldal.ahol.var.MYGLOBAL.ad.egy.erteket/" id="iframe" scrolling="no" frameborder="0" style="width: 100%;"></iframe><script type="text/javascript" >addEventListener("message", receiveMessage, false);function receiveMessage(event) {var BA = (event.data.v1);document.write(BA);}</script>Eredmény hogy fehér lapon meglkapom, hogy "MYGLOBAL okkéé" de ez eltünteti magát az Iframet.
-
btz
addikt
Egy IFRAME-ből ptóbálom kiszedni "a" változó értékét.
<iframe src="https://weboldal.ahol.var.a.ad.egy.erteket/" id="iframe" scrolling="no" frameborder="0" style="width: 100%;"></iframe>Négyféle variációt próbáltam.
1.
var check=document.getElementById("iframe").contentWindow.a;
document.writeln(check);
2.var check=document.getElementById("iframeid").contentDocument.a;document.writeln(check);3.
var b;
// you might want to write these into if statements to make sure that e.data[0] is varA if you have multiple messages coming across
if (typeof window.addEventListener != 'undefined') {
window.addEventListener('message', function(e) {
b = e.data[1];
}, false);
} else if (typeof window.attachEvent != 'undefined') { // this part is for IE8
window.attachEvent('onmessage', function(e) {
b = e.data; // you'll probably have to play around with this part as I can't remember exactly how it comes across in IE8 -- i think it will involve slice() iirc
});
}
document.writeln(b);ebben az esetben kell egy ilyen kód is az iframe-mel lekért oldalba
window.parent.postMessage(['varA', a], '*');4.
var myFrame = window.frames[0].window;
document.writeln(myFrame.a);Természetesen miért is működne bármelyik is. Mindegyik eredménye Undefined, kivéve a 4. eset, ott semmi. Különböző és azonos domainen lévő Iframe-mel próbálva.
-
btz
addikt
Üdv!
Egy popupot szeretnék megoldani, ami kattintásra megnyílik, a benne lévő gombbal bezáródik, illetve azt szeretném, hogyha mellé kattintok, akkor is záródjon be, de ha magára a popupra (a popup területére), akkor ne történjen semmi (ne záródjon be)
Odáig jutottam, hogy a popup szinte csak CSS alapon működik. Piros területen van egy link, arra ha rákattintok, akkor megnyílik a popup div (zöld színnel). A bezárást úgy oldottam meg, hogy a szülő divnek (piros színnel) adtam egy ilyen értéket, hogy:
<div id="parent" onclick="location.href='#';">
Ezzel az a gond, hogy a popup területén is érvényesíti magát.[A kód és a működés itt tekinthető meg]
Próbáltam azt is hogy a children divnek
onclick="return false;"vagyonclick="location.href='#children';"értéket adok , de akkor is a parent divben megadottonclick="location.href='#';"érvényesül, azaz "bezáródik" div.Ötletek esetleg?
-
btz
addikt
Az ötös verzióban visszaraktam a if (document.cookie.indexOf('tesztkuki') == -1 ) értéket és így most úgy néz ki, hogy tökéletes és a funkciójának megfelelően működik
Nem tudom pontosan, hogy az document.cookie.includes miért nem volt jó ehhez, ha ez is azt figyeli, hogy létezik e, majd utána olvasok, ha időm engedi.
Köszönöm a segítséget -
btz
addikt
A kódnak ebben a változatában kicseréltem a
$("#cookiebutton").click(function() {
$("#cookie-check").load(" #cookie-check > *");
});funkciót
$("#cookiebutton").click(function() {
if (document.cookie.indexOf('tesztkuki') == -1 ) {
document.getElementById('cookie-check').innerHTML = "<div id='cookie-want'>Press the button, if you want a cookie<br /><button id='cookiebutton' onclick='wantCookie()'>I want a cookie</button><br /></div> <br />The cookie now DOES NOT exist !";
} else {
document.getElementById('cookie-check').innerHTML = "<div id='cookie-give-back'>Press the button, if you want give back the cookie<br /><button id='cookiebutton' onclick='givebackCookie()'>I give back the cookie</button><br /></div> <br /><br />The cookie now exist !<hr />";
}
});funkcióra.
Így most az első klikk hatására visszaírja a divet a megfelelő tartalommal, de még egy kattintást már nem enged, másodjára nem változik a div a gombnyomásra. -
btz
addikt
Üdv!
<div id="cookie-check">
</div>Tartalmát ez a javascript kód "tölti fel":
if (document.cookie.indexOf('tesztkuki') == -1 ) {
document.getElementById('cookie-check').innerHTML = "<div id='cookie-want'>Press the button, if you want a cookie<br /><button id='cookiebutton' onclick='wantCookie()'>I want a cookie</button><br /></div> <br />The cookie now DOES NOT exist !";
} else {
document.getElementById('cookie-check').innerHTML = "<div id='cookie-give-back'>Press the button, if you want give back the cookie<br /><button id='cookiebutton' onclick='givebackCookie()'>I give back the cookie</button><br /></div> <br /><br />The cookie now exist !<hr />";
}Ha a süti létezik akkor az egyik document.getElementById('cookie-check').innerHTML = fut le, ha nem létezik, akkor a másik.
Van benne gomb, ami amellett, hogy onclick esetén végrehajtja a wantCookie() vagy a givebackCookie() funkciót újratölti a cookie-check id-vel rendelkező divet, ami üres, ezért újratöltés után üres lesz. Én azt szeretném, ha újratöltés után, újra felülírná a javascript a divet a megfelelő tartalommal a fenti if else utasítás szerint.A div újratöltéséért ez a kódrész felel:
$("#cookiebutton").click(function() {
$("#cookie-check").load(" #cookie-check > *");
});A teljes demo itt található:
CODEPEN DEMOElőre is köszönöm a válaszokat!
-
btz
addikt
Viszont most kaptam egy ilyen kódot egy másik fórumról
<div id="myDiv">
1234567890 ABCDEFG abcd efg
123
</div>
<div id="button">
<button onclick="myFunction()"><-DEL</button>
</div>
<script>
function myFunction() {
var txt = document.getElementById("myDiv").innerHTML.slice(0,-1);
document.getElementById("myDiv").innerHTML= txt;
//txt.slice(0,-1);
//var txt = $('#myDiv');
//txt.val(txt.val().slice(0, -1));
}
</script>Ez is az első clickre nem történik semmi (legalább is látszólag) betegségben szenved.
-
btz
addikt
Ez a verzió pedig egyszerűen nem működik és nem értem, hogy miért?
<div id="myDiv">
1234567890 ABCDEFG abcd efg
123
</div>
<p>This is a paragraph outside the div.</p>
<script>
function myFunction() {
var txt = $('#myDiv');
txt.val(txt.val().slice(0, -1));
}
</script>
<button onclick='myFunction()'>TÖRLÉS</button> -
btz
addikt
Közben találtam egy ilyent is.
Némi átalakítással csináltam belőle egy tartalom felett megjelenő bezárhatzó popup-ot
Van belőle animated verzió is. Nagyon cool
-
btz
addikt
Dehát azt a részt pont te javasoltad, hogy tegyem bele vagy én értettem félre valamit és beletettem, utána elkezdett úgy működni ahogy nekem kell.
Közben találtam a dologra egy végtelenül egyszerű és purritán megoldást. Szóval feleslegesen bonyolítottam az egészet 😃
Remélem ez széles körben standard dolog és a legtöbb böngésző támogatja.Ismerem a jsfidle-t és néha használom is, de ilyen purritán kódnál, az ágyúval verébre kategóriának érzem a használatát, főleg a külön szekcióba szedést (HTML, CSS, JS).
-
btz
addikt
Javascriptel szeretnék bezárni egy szövegrészt vagy egy egész divet egy bezár gombbal és magát a bezár gombot is el akarom tünteni.
A dialogal már próbálkoztam és működik is, de azt írják, hogy nem valami standard cucc, ezért szeretnék valami mást. A másik problémám még vele, hogy bezáráskor a tartalom az oldal tetejére ugrik, ami nem biztos, hogy jó, ha a felhasználó egy hosszú lap alján van.
Jelenleg van egy ilyenem. Ez bezárja ugyan a szöveget de magát a bezár gombot nem. És ha a gombot alulra teszem, akkor még azt sem.
Érdekelne, hogy milyen lehetőségek vannak még erre.
-
btz
addikt
Van egy ilyen dialogom:
https://www.w3schools.com/code/tryit.asp?filename=G4TB4HP92PJ0
Hogyan oldhatnám meg, hogy a dialog tartalma már a betöltéskor megjelenjen és a close gombal bezáródjon?
Jelenleg az van, hogy a dialog alapból nem jelenik meg.
-
btz
addikt
Sajnos nem lesz megúszva a w3 kód átalakítás 
Új hozzászólás Aktív témák
Hirdetés
- Asus - TUF Gaming A15 - FA506NC-HN039
- Intel Laminar RM1 PWM Intel CPU Hűtő (Socket 1700) - Új, bontatlan - Eladó!
- Beszámítás! Apple Mac Mini 2024 M4 16GB 256GB SSD számítógép garanciával, hibátlan működéssel
- BESZÁMÍTÁS! LG UltraGear 27GL850-B 144Hz QHD 1ms monitor garanciával hibátlan működéssel
- Csere-Beszámítás! Playstation 5 Slim Digital edition! OLVASS!
- LG 55G3 - 55" OLED evo - 4K 120Hz 0.1ms - MLA - 2000 Nits - NVIDIA G-Sync - AMD FreeSync - HDMI 2.1
- Microsoft Surface Book 3 - 15 col, i7, 32GB, GTX1660Ti
- Bomba ár! Dell Inspiron 5405 - Ryzen5 4500U I 8GB I 256SSD I 14" FHD I HDMI I Cam I W11 I Garancia!
- Külföldi csomagszállítás Packeta csomagpontokon keresztül!
- 13-14" Új és használt laptopok , üzletitől a gamerig , kedvező áron. Garanciával !
Állásajánlatok
Cég: Promenade Publishing House Kft.
Város: Budapest
Cég: PCMENTOR SZERVIZ KFT.
Város: Budapest