onclick und Instanz

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • onclick und Instanz

    Hallo zusammen,

    in meiner JS-Klasse erzeuge ich einen neuen Link mittels document.createElement('a'). Diesem Link möchte ich ein onclick zuweisen und zwar auf eine Funktion aus meiner JS-Klasse.

    Hab bisher folgendes probiert:

    PHP-Code:
    function A() {
    cancelLink.onclick this.cancelEditingNumber.apply(this);
    }
    this.cancelEditingNumber = function() {
    this.currentEditedContainer.innerHTML this.lastEditedNumber;

    Funktioniert nicht, weil mit dem apply das ja direkt aufgerufen wird. ein onclick=func(param) geht ja auch nicht, weil params nicht übergeben werden können.
    Dann hab ich mal das bind aus prototype angeschaut und das hier gemacht:
    PHP-Code:
    cancelLink.onclick = function() {return this.cancelEditingNumber.apply(this);} 
    Da bekomme ich dann this.cancelEditingNumber has no properties. Gleiches bei
    PHP-Code:
    cancelLink.onclick = function() {return cEN.apply(this);}
    function 
    cEN(inst) {
        
    inst.cancelEditingNumber();

    Langsam fallen mir keine Möglichkeiten mehr ein :-)

    DANKE!!

  • #2
    kannst du mal den kompletten code dazu posten?

    peter
    Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
    Meine Seite

    Kommentar


    • #3
      PHP-Code:
      function cEN() {
          
      this.cancelEditingNumber();
      }

      function 
      Editor() {

          
      this.editNumber = function(uniqueIDnumber) {

              
      currentEditedContainer document.getElementById('edit-' uniqueID);
              
              
      // create cancel button
              
      var cancelLink document.createElement('a');
              
      cancelLink.href 'javascript:void(0);';
              
      cancelLink.innerHTML 'Abbrechen';
              
      cancelLink.onclick = function() {return cEN.apply(this);}
              
      currentEditedContainer.appendChild(cancelLink);
          
          }
          
          
      this.hideEditing = function() {
          }
          
          
      this.cancelEditingNumber = function() {
          
              
      // remove all select boxes
              
              // remove buttons
              
              // write old value
          
      }

      Kommentar


      • #4
        du kannst hier nicht einfach auf die methode eines objektes zugreifen.
        PHP-Code:
        function cEN() {
            
        this.cancelEditingNumber();

        du musst zuerst eine referenz auf das objekt erzeugen.
        PHP-Code:
        function cEN() {
           var 
        obj = new Editor();
            
        obj.cancelEditingNumber();

        so in der art.

        peter
        Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
        Meine Seite

        Kommentar


        • #5
          Hm, in der Doku von "apply()" hatte ich das so verstanden, dass ich damit das this zuweisen kann. Das Problem ist, dass ich keine neue Instanz erzeugen kann, weil ich auf Instanzvariablen zugreifen muss.. Und der gepostete Code ist ja nur der Rahmen für die verschiedenen Möglichkeiten aus meinem ersten Post :-) Die funzen ja alle nicht

          Kommentar


          • #6
            habe mich ehrlich gesagt, noch nie mit apply beschäftigt. allerdings hast du da imho einen konstruktionsfehler in deinem script. du hast ein objekt mit mehreren methoden:
            PHP-Code:
            this.editNumber
            this
            .hideEditing
            this
            .cancelEditingNumber 
            jetzt greifst du innerhalb dieses objektes auf eine äußere funktion zu, die wiederum eine methode deines objektes aufruft. warum dieser umweg? du kannst doch hier direkt auf die methode zugreifen:
            PHP-Code:
            cancelLink.onclick = function() 
            {
               
            // hier auf this.cancelEditingNumber zugreifen

            peter
            Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
            Meine Seite

            Kommentar


            • #7
              Ich mag die Event-Funktionen von prototype (www.prototypejs.org) sehr, vor allem, weil die bestehende onClick-Definitionen stehenlassen und dort definierte Events einfach obendrauf gereiht werden.

              Aber xyz.onclick ist für den hier genannten Zweck natürlich völlig ausreichend.

              Kommentar


              • #8
                Hi,

                danke für eure Antworten. prototype möchte ich nicht verwenden, weil es ziemlich viel Daten wären, nur um das onlick Zeug verwenden zu können :-) Außerdem muss das ja auch so gehen.

                @Kropff: geht leider nicht:
                PHP-Code:
                cancelLink.onclick = function() {this.cancelEditingNumber();}; 
                Bringt mir JS-Fehler "this.cancelEditingNumber is not a function"

                Kommentar


                • #9
                  Benutzt Du denn "new"?

                  Kommentar


                  • #10
                    Hinter der letzten } der Klasse steht
                    PHP-Code:
                    var handyEditor = new HandyEditor(); 

                    Kommentar


                    • #11
                      Benutzt Du denn "new"?
                      braucht er doch nicht. allerdings ist da ein semikolon zuviel:
                      PHP-Code:
                      cancelLink.onclick = function() 
                      {
                        
                      this.cancelEditingNumber();
                      }; 
                      eigentlich sollte das so funktionieren. stell doch ein beispiel online.
                      EDIT:

                      Original geschrieben von strauberry
                      Hinter der letzten } der Klasse steht
                      PHP-Code:
                      var handyEditor = new HandyEditor(); 
                      jetzt zeig mal den kompletten code.


                      peter
                      Zuletzt geändert von Kropff; 04.08.2008, 19:16.
                      Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
                      Meine Seite

                      Kommentar


                      • #12
                        PHP-Code:
                        function HandyEditor() {

                            
                        this.serviceNumbers = new Array(151152157159160162163170171172173174175176177178179);

                            
                        this.editNumber = function(uniqueIDnumber) {
                            
                                var 
                        currentEditedContainer document.getElementById('editHandy-' uniqueID);
                                
                                
                        // split up number and save it
                                
                        numberParts number.split("-");
                                if(
                        numberParts.length != 3) {
                                    
                        numberParts[0] = '0049';
                                    
                        numberParts[1] = this.serviceNumbers[0];
                                    
                        numberParts[2] = '';
                                }
                                
                                
                        // get link element
                                
                        var editLink currentEditedContainer.getElementsByTagName('a')[0];
                                
                                
                        // save last edited number for cancel
                                
                        this.lastEditedNumber editLink;
                            
                                
                        // remove shown number
                                
                        currentEditedContainer.removeChild(editLink);
                                
                                
                        // create selectbox for country
                                
                        var countrySelect document.createElement('select');
                                
                        countrySelect.className 'text countryNo';
                                
                                var 
                        countryOption document.createElement('option');
                                
                        countryOption.value "0049";
                                
                        countryOption.text "0049";
                                
                        countryOption.selected 'selected';
                                
                        countrySelect.options[0] = countryOption;
                                
                                
                        // create selectbox for service
                                
                        var serviceSelect document.createElement('select');
                                
                        serviceSelect.className 'text serviceNo';
                                
                                for(
                        0this.serviceNumbers.lengthi++) {
                                    
                        tmp document.createElement('option');
                                    
                        tmp.text this.serviceNumbers[i];
                                    
                        tmp.value this.serviceNumbers[i];
                                    
                        serviceSelect.options[i] = tmp;
                                }
                                
                                
                        // create input for number
                                
                        var numberInput document.createElement('input');
                                
                        numberInput.className 'text numberInput';
                                
                                
                        countrySelect.id 'countrySelect_' uniqueID;
                                
                        currentEditedContainer.appendChild(countrySelect);
                                
                                
                        // create selectbox with first part
                                
                        serviceSelect.id 'serviceSelect_' uniqueID;
                                
                        serviceSelect.value numberParts[1];
                                
                        currentEditedContainer.appendChild(serviceSelect);
                                
                                
                        numberInput.value numberParts[2];
                                
                        numberInput.id 'numberInput_' uniqueID;
                                
                        currentEditedContainer.appendChild(numberInput);
                                
                                
                        // create cancel button
                                
                        var cancelLink document.createElement('a');
                                
                        cancelLink.href '#';
                                
                        cancelLink.innerHTML 'Abbrechen';
                                
                        cancelLink.setAttribute('onclick''handyEditor.cancelEditingNumber(); return false;');
                                
                        currentEditedContainer.appendChild(cancelLink);
                            
                            }
                            
                            
                        this.hideEditing = function() {
                            }
                            
                            
                        this.cancelEditingNumber = function() {
                            
                                var 
                        currentEditedContainer document.getElementById('editHandy-' uniqueID);
                            
                                
                        // remove all select boxes
                                
                        var selBoxes this.currentEditedContainer.getElementsByTagName('select');
                                
                                
                        // remove buttons
                                
                                // write old value
                                
                        this.currentEditedContainer.appendChild(this.lastEditedNumber);
                            
                            }

                        }

                        var 
                        handyEditor = new HandyEditor(); 
                        Hab das mit dem onclick jetzt über die setAttribute Methode gelöst. Gefällt mir nicht ganz so, aber hauptsache, es funzt erstmal. Optimieren kann ich immer noch :-)

                        Kommentar


                        • #13
                          Hab das mit dem onclick jetzt über die setAttribute Methode gelöst
                          auch mal im ie getestet?

                          peter
                          Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
                          Meine Seite

                          Kommentar


                          • #14
                            Fuck ne :-) Deiner Frage nach will ich das jetzt aber auch nicht mehr

                            Kommentar


                            • #15
                              mach es mal

                              peter
                              Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
                              Meine Seite

                              Kommentar

                              Lädt...
                              X