• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

[GELÖST] [jQuery] Funktion in ein Objekt kapseln

P

pumi

New member
Hallo,

ich versuche eine jQuery-Function in ein eigenes Objekt zu kapseln.
Leider funktioniert der Aufruf "s.mycss("background-color", "red");" nicht.
"Normale"-Funktionen konnte ich bisher so zuweisen.
Was mache ich falsch?
Code: 
<!DOCTYPE html>
<html>
<head>
    <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
    <script>
        var myobj = function(id, cssStr) {
            var obj = $(id);
            this.mycss = obj.css;
        }

            function createSite() {
                var s = new myobj("#div123");
                //geht nicht
                s.mycss("background-color", "red");
                //geht
                $("#div123").css("background-color", "red");
            }
    </script>
    <style>
        div {
            background-color: gray;
            width: 100%;
            height: 200px;
        }
    </style>
</head>
    <body onload="createSite()">
        <div id="div123"></div>
    </body>
</html>

Danke vorab und Grüße pumi

Bitte in diesem Fall die Signatur ignorieren.
Ich gebe jQuery eine Chance...
 
Zuletzt bearbeitet von einem Moderator:
AW: jQuery Funktion in ein Objekt kapseln

Ich verstehe den Sinn hinter dieser Funktion leider nicht so wirklich. Warum möchtest du die css() Funktion von JQuery nochmal kapseln?
 
AW: jQuery Funktion in ein Objekt kapseln

Hallo rico2009,

danke für dein Interesse.
Ich möchte ein Framework zur Formularerstellung erstellen, auf Basis von jQuery.
Dafür ist es notwendig die jQuery-Funktionen eigenen Objekten zuzuweisen/zu erweitern.

Viele Grüße pumi
 
AW: jQuery Funktion in ein Objekt kapseln

pumi schrieb:
Ich möchte ein Framework zur Formularerstellung erstellen, auf Basis von jQuery.
Dafür ist es notwendig die jQuery-Funktionen eigenen Objekten zuzuweisen/zu erweitern.
Zum Vergrößern anklicken....
dafür erstellt man normalerweise ein jquery plugin, also genau umgekehrt, du weisst jQuery funktionalität hinzu und nicht deiner funktionalität jquery.
willst du das nicht, geht das so nicht, wie du dir das gedacht hast, weil du eine funktion von jquery deinem objekt zuweisst, diese funktion von jquery aber interne funktionalität von jquery nutzt, die deinem objekt fehlt. du müsstest eine eigene css methode schreiben, die auf das aggregierte jquery weiterleitet.
 
AW: jQuery Funktion in ein Objekt kapseln

danke für die Antwort.
Ich verstehe so langsam das Problem.
jQuery hat irgendeine Magic, die ich (noch) nicht erfassen kann.
Ich könnte nat. so was machen:
Code: 
var myobj = function(id) {
            var obj = $(id);
            this.mycss = function(cssStr, value) {
                if (value !== "undefined") {
                    obj.css(cssStr, value);
                } else {
                    obj.css(cssStr);
                }
            }
        }
aber das müsste ich nat. jede Variante der Funktion kennen und nachstellen.
Ich schau mir das mit dem Plugins mal an, ist aber eig. nicht das was ich wollte,
aber ich schaue auch gern mal über den Tellerrand hinweg...

Grüße pumi
 
AW: jQuery Funktion in ein Objekt kapseln

pumi schrieb:
jQuery hat irgendeine Magic, die ich (noch) nicht erfassen kann.
Zum Vergrößern anklicken....
das hat nichts mit jquery zu tun
Code: 
var obj1 = {
  aaa: function()
  {
    return 1;
  },
  bbb:function()
  {
    return this.aaa() + 1;
  }
};
var obj2 = {
  xxx: obj1.bbb
}
alert(obj1.bbb());
alert(obj2.xxx());

pumi schrieb:
aber das müsste ich nat. jede Variante der Funktion kennen und nachstellen.
Zum Vergrößern anklicken....
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments#Description
 
AW: jQuery Funktion in ein Objekt kapseln

danke für die Antwort.
Kannst du mir viell. noch einen Tip geben, wie ich arguments dynamisch übergeben kann?
Code: 
function css(cssStr) {
                
				console.log(arguments);
				var args = Array.prototype.slice.call(arguments);
                //console.log("args: "+ args);
				//return args.join(cssStr);
				//geht nicht
				$("#div123").css(args);
				//geht nicht
				$("#div123").css(arguments);
				//geht
				$("#div123").css(arguments[0], arguments[1]);
				
            }
Wenn ich arguments aufrufe dann geht es, ist aber blöd, weil ich dann ja wieder
wissen muss wie viele es sind.
Hat du eine Idee, wie es richtig geht?
Habe schon alle mögl. Varianten aus dem Netz probiert, aber es klappt nicht...

Danke und Grüße pumi
 
AW: jQuery Funktion in ein Objekt kapseln

pumi schrieb:
Ich möchte ein Framework zur Formularerstellung erstellen, auf Basis von jQuery.
Dafür ist es notwendig die jQuery-Funktionen eigenen Objekten zuzuweisen/zu erweitern.
Zum Vergrößern anklicken....
Wie hesst schon geschrieben hat, deine Vorgehensweise ist sehr suboptimal.

Aber wie ich sehe, hat hesst dir schon weitergeholfen.
 
AW: jQuery Funktion in ein Objekt kapseln

danke für deine Antwort.
Mit apply hatte ich es auch schon probiert, aber es funktioniert nicht.
Vielleicht habe ich es auch falsch verstanden.
Kannst du bitte noch mal drüber schauen?
Code: 
<!DOCTYPE html>
<html>

<head>
    <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
    <script>
        function onrun() {
            mycss("background-color", "red");
        }

        function mycss(cssStr) {
            //geht nicht
            $("#div123").css.apply(this, arguments);
            //geht
            //$("#div123").css(arguments[0], arguments[1]);
        }
    </script>
    <style>
        div {
            background-color: gray;
            width: 100%;
            height: 200px;
        }
    </style>
</head>

<body onload="onrun()">
    <div id="div123"></div>
</body>

</html>
 
AW: jQuery Funktion in ein Objekt kapseln

ja ist gelöst.
Daher mit:
Code: 
$("#div123").css.apply($("#div123"), arguments);
geht es.
 
Mit einem .bind() könnte man das Problem, meiner Meinung nach, leichter lösen - auch wenn ich auch der Meinung bin, dass man das wahrscheinlich besser mit einem Plugin lösen könnte:
Code: 
<!DOCTYPE html>
<html>
<head>
    <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
    <script>
        var myobj = function(id, cssStr) {
            var obj = $(id);
            this.mycss = obj.css.bind(obj);
        }

            function createSite() {
                var s = new myobj("#div123");
                //geht
                s.mycss("background-color", "red");
            }
    </script>
    <style>
        div {
            background-color: gray;
            width: 100%;
            height: 200px;
        }
    </style>
</head>
    <body onload="createSite()">
        <div id="div123"></div>
    </body>
</html>
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben