Tjena! Jag skulle gärna hjälpa dig... om jag förstod vad du ville göra... Tjena! När jag skapar en HTML-sida med Tja "DOM i stället för Javascript"? DOM är till skillnad från JavaScript/ECMAScript inget programmeringsspråk. Det är en modell för vilka metoder som skall finnas för att komma åt olika noder i XML- och HTML-dokument. Modellen kan implementeras i olika språk. Mest känd är implementationen i JavaScript, men den kan även implementeras i t.ex. Java, C++, C#, Python, PHP, ... Jo det vet jag också. Bara för att klargöra... Vad menar du när du skriver "subobjekt"? Nej jag håller på att lära mig. Tack för exemplet. Hehe, nä det har blivit rätt mycket. Jag kan förstå att alert('test') körs. Vad tycker du själv borde hända i stället? Undrar bara ifall man kan skippa det här: Här är ett kodexempel: Ok den var snygg! Vilket objekts egenskaper är det du menar att du vill komma åt? Vilket är "topobjektet"? Ett sätt är att lägga objektet superapa i den globala namnrymden: Hmm ingen av dom där skulle funka i min kod. Den första skulle anropa sysInit innan onload, vilket skulle resultera i att jag får error på element som inte har renderats än. Så här? Tjena! Hehe ye! Använder du mwas någonstans? Annars borde du kunna skippa raden Jo jag använder den.Javascript Prototype
Jag håller på att lära mig OOP i Javascript. Har meckat en del med prototype, men jag kan inte riktigt få det att funka.
Tänke om det var någon här som var kung på Prototype som kan hjälpa mig lite.
Så här ser koden ut just nu:
function sysInit()
{
// Create & Assign objects
this.objDOMWindow = window;
this.objDOMDocument = this.objDOMWindow.document;
// Properties
// Methods
this.objSYSContent = getIFrame;
// Get content blocks
}
function getIFrame(aID){
this.objELMIFrame = this.objDOMDocument.getElementById(aID);
return (this.objELMIFrame.contentWindow || this.objELMIFrame.contentDocument);
}
getIFrame.prototype = new sysInit;
window.onload = function () {
system = new sysInit;
alert(system.objSYSContent('sys_content_wrapper'));
};
I övan kod så alertar den den iFramens window som har ID:t sys_content_wrapper.
Det jag egentligen vill är att skapa ett content objekt istället. Jag vill fördefinera detta redan i sysObjObject funktionen.
Jag vill definera ett objekt typ så här i sysInit():
this.objSYSContentIframeElm = något...
this.objSYSContentIframeWindow = något...
I alla object som skapas utifrån superobjektet system så vill jag kunna referera till this.objSYSContentIFrameElm och då få tillbaka det elementet, ifall att det inte ändrat i hierkin. Jag skulle kunna använda mig av ovan kod(längst upp), men jag vill ha dessa dela fixat redan från början, då blir det lättare att lägga till en iFrame och sen bara skapa ett objekt för den. Sen så blir det tydligare kod utan att
behöva inkludera ID:t för vara egenskap jag vill få från objektet.
Som ni kanske märker så är det rätt rörigt, håller på att lära mig det här så ni får ursäkta ifall det är helt obegripligt.
Hoppas någon här kan hjälpa mig med detta.
Mvh
AddeSv: Javascript Prototype
Ett exempel på otydlighet:
Du skriver: "Jag vill fördefinera detta redan i sysObjObject funktionen."
Var finns den funktionen?Sv:Javascript Prototype
Hehe, jo jag kanske råka skriva fel, när jag skrev sysObjObject så var det sysInit som det skulle vara.
Det är inte så lätt att förklara detta. När jag har laddat klart sidan så vill jag att det skapas
ett super objekt. För detta objekt vill jag definera
olika element samt DOM object Window, Document osv...
Alla methoder och funktioner som skapas för super objektet ska vara tillgänglig för alla
objekt som skapas under super objektet oberoende på hur många objekt det finns. Alltså att den ärver
objektets metoder och egenskaper, om jag inte längre ner i kedjan av object och subobjekt bestämmer
mig för att ändra en egenskap.
Det som försvårar saker och ting, vilket jag också märk så finns det inte så många sidor som har bra
exempel på det, är att jag kör onload när jag laddat klart sidan för att sedan skapa objekt och egenskaper för dessa.
Dvs jag vill bygga systemet med DOM och prototype via javascript, alltså inte ren Javascript, vilket alla tutorials för prototype verkar
illustrera.
Ifall jag först har ett superobjekt och sedan bestämmer mig för att köra en funktion som inte är knutet till superobjektet
via dess funktion, så vill jag istället att den går via prototype kedjan genom alla subobjekt som hör till superobjektet...
eh förstod du vad jag menade?
Kolla här:
function superobject()
{
this.minmetod = minmetod;
}
window.onload = function(){
super = new superobject();
};
i detta fall så skapas en minmetod metod för super objektet.
Om jag nu gör så här:
function superobject()
{
this.name = 'achmeed'
this.minmetod = minmetod;
}
function sub()
{
alert(this.name);
}
window.onload = function(){
super = new superobject();
sub.prototype = new superobject();
ulla = new sub();
};
ifall detta skulle funka som jag vill, så vill jag att alert(this.name); eller alert(ulla.name); blir "achmeed".
Men det har jag inte fixat. Om jag sen längre ner i någon annan funktion/metod skapar ett nytt subobject så vill jag automatiskt
att detta ska ärva super ojektets namn.
Hmm hoppas det förklarar lite mer...
/AddeSv: Javascript Prototype
function superobject()
{
this.name = 'achmeed'
//this.minmetod = minmetod;
}
function sub()
{
alert(this.name);
}
window.onload = function(){
super = new superobject();
sub.prototype = new superobject();
ulla = new sub();
};
så kommer en alert-ruta upp med texten "achmeed".
Jag var tvungen att kommentera bort
<code> this.minmetod = minmetod;</code>
eftersom ingen funktion med namnet minmetod är definierad.
Sv:Javascript Prototype
Alltså det blir lite annorlunda när jag använder mig av onload i samband med andra events.
Det är också klurigt att ärva egenskaper utan att gå via metoder som är kopplade till super objektet.
Ifall jag har en metod i superobjektet och sen en till metod i den funktionen säger inte att jag direkt ärver
superobjektets egenskaper....
Rätt svårt att förklara...
Snälla ifall du vet någon bra länk till en sida som kan demonstrera ärvda classer via DOM istället för Javascript
så skulle jag vara väldigt tacksam!
/AdrianSv: Javascript Prototype
Sv:Javascript Prototype
Det jag menade var mer att jag vill använda mig av en kombination av DOM och OOP Javascript. När det gäller OOP i Javascript så är det rätt meckigt att skapa objekt och köra events via prototype, eller har du något bra exempel? Iallafall events biten för att ärva klasser. Dom flesta tutorials jag har sett visar inte onload modeller med mera som faktiskt resulterar i en fungerande webbapplikation via OOP Javascript. Ett exempel på dessa tutorials är att dom kör tex:
function ulla(){någon subobject egenskap}
//och sedan sätter prototype utanför funktionen, som tex:
ulla.prototype = new names();
//om jag sedan kör window.onload=new names('yurgen');
Så har redan names(); körts redan där jag deklarerar ulla.prototype.
Inte så bra, då får jag errors för dom objekten som skapas för vissa element
i names redan innan sidan har laddas klart. Detta vill jag inte! Dessa exempel är vanliga
och funkar inte i en webbapplikations värld. Rätta mig om jag har fel.
Frågan är enkel hur använder jag prototype för onload event = super objekt och sedan ärva via alla sub objekt?Sv: Javascript Prototype
En sak jag undrar är om du har förstått hur prototype fungerar. Jag misstänker att du tror att <b>F.prototype = new G();</b> i JS betyder exakt samma sak som <b>class F extends G</b> i "normal" OO. Så är inte fallet...
Om vi har koden
function F(n)
{
this.n = n;
}
F.prototype = obj;
och kör
var new_obj = new F(3);
så kan man tänka på det som att följande sker:
* objektet F.prototype kopieras/klonas,
* funktionen F anropas med this satt till kopian från förra steget.
Sv:Javascript Prototype
Kan du visa ett fungerande exempel på onload event med window objekt och tex 3 div element, dessa ska vara childobjekt till ett eget definerat superobjekt(det som är längst upp i kedjan) via prototype. Kolla på detta som jag gjort, kanske du kan hjälpa mig.
Nedan funkar inte som jag vill, det jag vill är att i xml_http_request.prototype.send kunna komma åt mwas egenskaper och metoder?
Är detta möjligt...?
function sysInit()
{
// Create & Assign objects
this.objDOMWindow = window;
this.objDOMDocument = this.objDOMWindow.document;
this.objContentElm = this.objDOMDocument.getElementById('sys_content_wrapper');
this.objToolboxElm = this.objDOMDocument.getElementById('sys_toolbox');
this.objToolboxElmStyle = this.objToolboxElm.style;
this.objContentWindow = (objContentElm.contentWindow || objContentElm.contentDocument);
this.objContentDocument = this.objContentWindow.document;
this.objContainers = new Array();
// Properties
this.objToolboxElmStyle.visibility = 'visible';
this.objContentWindow.activeContainer = null;
// Methods
this.contentLoad = contentLoad;
}
function contentLoad(activate)
{
this.objSYSBlocks = this.objContentDocument.getElementsByTagName('span');
for (var x=0; x<this.objSYSBlocks.length; x++)
{
if (this.objSYSBlocks[x].id == 'wbablock'){
if (activate){
this.activateBlocks(x);
}
else
{
this.deActivateBlocks(x);
}
}
}
}
window.onload = function () {
mwas = new sysInit;
mwas.contentLoad(true);
// DET HÄR VILL JAG GÖRA
mwas.testRequest = new xml_http_request();
mwas.send();
// JAG VILL OCKSÅ ATT mwas objektet ska ärvas
// ner i xml_http_request.prototype.send
}
sysinit.prototype.xml_http_request() {
this.req=getRequest();
var lock=this;
this.req.onreadystatechange = function() {lock.processedRequest}
//addEventListener/attachEvent still doesn't work
function getRequest() {
try {
if(window.XMLHttpRequest) {
try {
return new XMLHttpRequest();
} catch(e) {
return false;
}
// branch for IE/Windows ActiveX version
} else if(window.ActiveXObject) {
try {
return new ActiveXObject('Msxml2.XMLHTTP');
} catch(e) {
try{
return new ActiveXObject('Microsoft.XMLHTTP');
} catch(e) {
return false;
}
}
}
} catch(e){
return false;
}
}
}
xml_http_request.prototype.send=function(type){
switch(type) {
case 'publishpage':
this.contentLoad(false);
this.req.open('POST', '../system/includes/publishpage.php', true);
this.req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
this.req.send('html=' + escape(this.objContentDocument.documentElement.innerHTML));
break;
case 'save':
break;
}
}
xml_http_request.prototype.processedRequest=function(){
if (this.req.readyState == 4) {
if(this.req.status == 200) {
if (this.req.responseText == 1) {
alert(1);
}
} else {
// alert(this.req.statusText);
}
}
}Sv:Javascript Prototype
Här är en förenklad skum variant, som funkar:
function init()
{
this.name = 'test';
this.request = request;
this.send = request.prototype.send;
}
function request()
{
// this.req = new XMLHttpRequest();
}
request.prototype.send = function () {
alert(this.name);
}
window.onload = function (){
var mwas = new init();
request.prototype = new init();
var apa = new request();
apa.send(); // alerts 'test'
}
Hur sjukt det än ser ut så alertar den 'test'...
Det blir inga fel i Firefox, vilket är den enda som detta ska funka i. Skrev inte det förut...sorry.
Hursomhelst, kan det vara så att när jag kör request.prototype = new init(); att något blir fel där?
Finns det något annat sätt att skriva det på?Sv: Javascript Prototype
Sv:Javascript Prototype
this.request = request;
this.send = request.prototype.send;
och bara ha kvar:
request.prototype = new init;
Känns inte som det görs rätt.Sv: Javascript Prototype
// Konstruktor
// Om argumentet name ges, används det för medlemmen name,
// annars används defaultvärdet från prototypen.
function request(name)
{
if(name)
this.name = name;
}
// Prototypen innehåller ett defaultvärde på name samt en funktion/metod send()
// Observera syntaxen för att konstruera generella objekt.
request.prototype = {
name : 'Gorilla',
send : function () { alert(this.name); }
}
// Vid laddning skapas dels ett requestobjekt med angivet värde på name,
// dels ett dito med defaultvärdet på name.
window.onload = function (){
var apa = new request('Chimpans');
apa.send(); // alerts 'test'
var bepa = new request();
bepa.send();
}
Sv:Javascript Prototype
Men ifall jag har ett objekt ovan Request hur kommer jag åt dess egenskaper och metoder inne i Send? Jag vill nämligen
komma åt egenskaper i topobjektet.
Typ:
function super(name)
{
if(name)
this.name = name;
}
function request(name)
{
if(name)
this.name = name;
}
request.prototype = {
name : 'Gorilla',
send : function () { alert(this.name); }
}
window.onload = function (){
var superapa = new super('ulla');
// Det här funkar inte...
request.prototype = super;
var apa = new request('Chimpans');
apa.send(); // alerts 'test'
var bepa = new request();
bepa.send();
}
/AddeSv: Javascript Prototype
Sv: Javascript Prototype
<code>
var superapa = new super('ulla');
window.onload = function (){
</code>
Ett annat är att använda prototype:
<code>
request.prototype = new super;
request.prototype.name = 'Gorilla';
request.prototype.send = function () { alert(this.name); }
</code>
Detta ersätter då
<code>
request.prototype = {
name : 'Gorilla',
send : function () { alert(this.name); }
}
</code>Sv:Javascript Prototype
Den andra funkar inte heller av samma orsak. Den tredje skulle funka men ifall jag har ett objekt över request objektet som är högre upp i
hierkin, hur kan jag i xmlhttprequest.prototype.send tex komma åt sysInit's egenskaper?
Kolla här, om du pallar, detta är lite data jag jobbar med just nu:
function sysInit() {
// Create & Assign elements/objects
this.objDOMWindow = window;
this.objDOMDocument = this.objDOMWindow.document;
this.objDivElm = this.objDOMDocument.getElementById('a1');
// Känns som det är här det blir fel....HUR SKA JAG GÖRA för att ärva sysInit instansen?
// Var ska jag lägga den?
xmlhttprequest.prototype = this;
}
function xmlhttprequest()
{
if(!window.XMLHttpRequest) {
try {
var lock = this;
this.req = new XMLHttpRequest();
this.req.onreadystatechange = function(){lock.xmlhttpprocess};
} catch(e) {
this.req = null;
return false;
}
}
}
xmlhttprequest.prototype.send = function (){
alert(this.objDivElm.innerHTML); // vill alerta div element text, vill ärva från sysInit
alert(this.req); // vill alerta 'object xmlhttprequest'
}
xmlhttprequest.prototype.xmlhttpprocess = function ()
{
alert(this.objDivElm.innerHTML); // vill alerta div element text, vill ärva från sysInit
alert(this.req); // vill alerta 'object xmlhttprequest'
}
window.onload = function () {
mwas = new sysInit;
xmlhttp = new xmlhttprequest();
xmlhttp.send();
}Sv: Javascript Prototype
window.onload = function () {
xmlhttprequest.prototype = new sysInit;
xmlhttp = new xmlhttprequest();
xmlhttp.send();
}
Sv:Javascript Prototype
Tack för alla tidigare svar! :)
Testade det du skrev, men det funkar inte. Ifall jag tex försöker alerta this.t som är en egenskap som defineras i
sysInit så är den undefined. :(
Har du någon lösning på det?Sv: Javascript Prototype
Jag lyckades! Otroligt...men jag vet inte om den är så smart uppbyggd.
Nu ärver jag från mwas classen, jag får this.objDOMWindow och this.req i både processer och send.
Så här gjorde jag. Kanske du vet ett bättre sätt.
function sysInit() {
// Create & Assign elements/objects
this.objDOMWindow = window;
}
function xmlrequest () {
if(window.XMLHttpRequest) {
try {
this.req = new XMLHttpRequest();
var lock = this;
this.req.onreadystatechange = function(){lock.processer()}
} catch(e) {
return false;
}
}
}
sysInit.prototype.processer = function (){
alert(this.req);
alert(this.objDOMWindow);
}
sysInit.prototype.send = function (){
alert(this.req);
alert(this.objDOMWindow);
}
window.onload = function () {
mwas = new sysInit;
xmlrequest.prototype = new sysInit;
mwasreq = new xmlrequest();
mwasreq.send();
}
Om inte så vill jag tacka dig för att du stod ut med mina knasiga frågor. :)Sv:Javascript Prototype
<b> mwas = new sysInit; </b>Sv: Javascript Prototype
Men möjligtvis så tar jag bort den sen. Tack för tipset!