Jquery: Ma classe ne fonctionne pas pendant le deuxième appel

Je suis nouveau à jQuery.Juste apprendre et utiliser pendant 3 semaines jusqu'à maintenant. J'ai écrit un cours pour organiser des choses. J'appelle ma méthode avec plus de 2 événements, mais l'événement ne fonctionne pas pendant mon déclenchement du second événement. il n'y a rien de mal avec le sélecteur. Je pense qu'il manque quelque chose dans ma classe. Je ne sais pas. aidez s'il vous plaît! est ici l'extrait:Jquery: Ma classe ne fonctionne pas pendant le deuxième appel

$("#btnPersonalNext, #btnDocListBack, #pDocList").livequery('click',function() 
{ 
    var docListContent = 'loadDocumentList.php'; 
    $("#contentpaper").addContent(
    { 
    _tag:'div', 
    _id: 'contentDocList', 
    _class: 'content', 
    _content: docListContent, 
    _heading: 'Document List' 
    }); 
    //store personal info in session: 
});

addContent() est la fonction. lorsque je clique sur #btnPersonalNext, cela fonctionne, mais pour #btnDocListBack, pas plus.

Voici ma classe (jquery.content.js). ce qu'il fait est de charger html dans un certain _tag avec un particulier _id.

(function($) 
{ 
    $.fn.addContent = function(options) 
    { 
    var defaults = { 
     _tag: 'div', 
     _id: '', 
     _class: '', 
     _content: '', 
     _heading: '', 
     _clearExisting:'yes', 
     _insertAfterID:'', 
     _deleteBeforeInsert:'no' 
    }; 
    var options = $.extend(defaults, options); 

    return this.each(function() 
    { 
     obj = $(this); 
     if(options._clearExisting=='yes'){ 
     obj.empty(); 
     } 
     if(options._deleteBeforeInsert =='yes'){ 
     $('#'+options._id).remove(); 
     } 

     var innerHtml = '<' + options._tag + ' id="' + options._id + '" class="' + options._class + '">'; 
     if(options._heading!=''){ 
     innerHtml += '<h2>' + options._heading + '</h2>'; 
     } 

     if(/^[A-Za-z0-9]+\.php(\??([A-Za-z0-9]+=[A-Za-z0-9]+)(&[A-Za-z0-9]+=[A-Za-z0-9]+)*)?$/.test(options._content)) 
     {//if .php 
     $.get(options._content,function(data) 
     { 
      //handle response from server here. 
      innerHtml += data; 
      innerHtml +='</' + options._tag + '>'; 
      if(options._insertAfterID !=''){ 
      $('#'+options._insertAfterID).after(innerHtml); 
      } 
      else{ 
      obj.html(innerHtml); 
      } 
     }); 
     } // PHP rule 
     else 
     {// .html 
     innerHtml += options._content; 
     innerHtml +='</' + options._tag + '>'; 
     if(options._insertAfterID !=''){ 
      $('#'+options._insertAfterID).after(innerHtml); 
     } 
     else{ 
      obj.html(innerHtml); 
     } 
     } // HTML rule 
    }); // End of Returned Function 
    };// End of addContent definition 
})(jQuery);

en espérant des réponses, merci beaucoup!

voici ma structure DOM:

 
<!-- JS --> 
<script type="text/javascript" src="jquery_plugins/jquery-1.2.6.js" ></script> 
<script type="text/javascript" src="jquery_plugins/jquery.livequery.js" ></script> 
<script type='text/javascript' src='jquery_plugins/jquery.simplemodal.js'></script> 
<script type="text/javascript" src="jquery_plugins/jquery.session.js"></script> 
<!--<script type="text/javascript" src="jquery_plugins/jquery-plugin-wrapinner.js"></script>--> 
<script type="text/javascript" src="jquery_plugins/jquery.content.js"></script> 
<script type="text/javascript" src="jquery_plugins/osra_main.js"></script> 
</head> 

<body> 
<div id="wrapper"> 
    <div id="header"> 
     <div id="headercontent">Please Enable JavaScript to Continue</div> 
    </div> 
    <div id="main"> 
     <div id="sidebarpaper" class="left"> 
      <!-- sidebar contents (class="sidebar")--> 
     </div> 
     <div id="contentpaper" class="right"> 
      <!-- main contents (class="content")--> 
     </div> 
     <div id="modals" class="clear"> 
      <!--modal pop-up window --> 
     </div> 
    </div> 
    <div id="footer"><p></p></div> 
</div> 
</body> 
</html>

Je suis en train de charger le contenu dynamique en div avec id #contentpaper. Je ne sais pas comment redéfinissez, autre que l'utilisation de plugin livequery, avec cet usage: $("#btnID").livequery('click',function(){});

-bgreen1989

Source

2008-12-15 mars-o

Je ne vois pas où les boutons dont vous parlez sont définis? btnDocListBack btnPersonalNext etc? – krosenvold

Je lui ai donné un coup d'œil sur et la taille du code était un peu difficile à diagnostiquer, donc j'ai factorisé un peu l'espoir de le rendre plus compréhensible à moi-même et aux autres. Ce que je pense est une partie du problème et un BADTHING (TM) est votre génération de html en collant des chaînes ensemble. Cela peut casser la liaison d'événement DOM, et rendre le code vraiment affreux. De plus, vu que vous vous reposez sur live-query, la méthode "colle enchaînement" peut ne pas déclencher les événements dom nécessaires pour faire un trick de requête live (Not Certain) et vous/peut/find utiliser des méthodes DOM pour générer des éléments DOM devrait résoudre ce problème

(function($){ 
    $.fn.addContent = function(options) 
    { 
    var defaults = { 
     _tag: 'div', 
     _id: '', 
     _class: '', 
     _content: '', 
     _heading: '', 
     _clearExisting:'yes', 
     _insertAfterID:'', 
     _deleteBeforeInsert:'no' 
    }; 
    var options = $.extend(defaults, options); 
    var phpregex = /^[A-Za-z0-9]+\.php(\??([A-Za-z0-9]+=[A-Za-z0-9]+)(&[A-Za-z0-9]+=[A-Za-z0-9]+)*)?$/; 

    var x_generateElement = function() 
    { 
     var container = document.createElement(options._tag); 
     $(container).attr("id", options._id); 
     $(container).addClass(options._class); 
     if(options._heading!=''){ 
     var header = document.createElement("h2"); 
     $(header).text(options._heading); 
     $(container).append(header); 
     } 
     return container; 
    }; 

    var x_preClear = function(obj) 
    { 
     if(options._clearExisting=='yes'){ 
     obj.empty(); 
     } 
     if(options._deleteBeforeInsert =='yes'){ 
     $('#'+options._id).remove(); 
     } 
     return obj 
    }; 

    var x_addElement = function(e , obj) 
    {  
     if(options._insertAfterID !=''){ 
      $('#'+options._insertAfterID).after(e); 
     } 
     else{ 
     obj.html(e); 
     } 
     return obj; 
    }; 

    return this.each(function() 
    { 
     var obj = x_preClear($(this)); 
     var container = x_generateElement(); 

     if(phpregex.test(options._content)){ 
     $.get(options._content,function(data){ 
      //handle response from server here. 
      $(container).append(data); 
      obj = x_addElement(container, obj); 
     }); 
     } else { 
     $(container).append(options._content); 
     obj = x_addElement(container, obj); 
     } 
    }); 
    }; 
})(jQuery);

Source

2008-12-15 07:11:50

Jquery: Ma classe ne fonctionne pas pendant le deuxième appel

Répondre

Questions connexes