Javascript 如何拥有可重用的jquery表单模型

我有一些文件：

*vehicule_parc.php：*

<script language=javascript src="../js/vehicule_parc.js"></script>
<h3 class="headInfoBox" id="cch">Conso Carburant >></h3>
<hr />
    <div id="cc">           
        <table cellpadding="0" cellspacing="0" border="0" class="display boxtable" id="consoTable">
            <thead>
                <tr>
                    <th>Date</th>
                    <th>Heure</th>
                    <th>Quantité</th>
                    <th>Coût</th>
                    <th>Carte</th>
                </tr>
            </thead>
            <tbody>
                <tr class="odd gradeA">
                    <td>21/03/2011</td>
                    <td>10:00</td>
                    <td>30</td>
                    <td>40</td>
                    <td>02248</td>
                    </tr>
            ...
    </div><!-- cc -->
<button id="addcc">Ajouter</button>
<?php include 'form_conso_carb.html'; ?>

因此，我将把您在

vehicleue\u parc.js

中看到的代码放在一个可重用的文件中。但问题是，代码必须知道表的id—这里是

id=“constable”

—才能使用ajax创建表。 为什么不呢，form_conso_carb.html也在同一个文件中

目标是简单地将非模态形式添加到CRUDA

consolable

---

我希望我可以理解。

将其设置为函数，并在单击事件中使用

this

引用当前对象并将其作为参数传递：

    function showDialog(element) {
       $(element).dialog({
            autoOpen    : false,
            height      : 'auto',
            width       : 300,
            modal       : true,
            position    : 'middle',
            Cancel  : function() {
                        J(this).dialog( "close" );
                    },
            buttons : {
                "Envoyer"   : function() {

                            }
            }
        });
        }

        J( "#addcc" )
        .button()
        .click(function() {
            showDialog(this);
        });
   }

我有来自的解决方案，我必须封装代码，如本例所示，并将其放入一个文件中：

var bibliJsActif = (function() { 
  // Membres privés 
  function init() { 
    bibliJsActif.ajouterClasse(document.body, bibliJsActif.nouvelleClasse); 
  } 

  if (document.getElementById && document.createTextNode) { 
    window.onload = init; 
  } 

  // Membres publics 
  return { 
    "ajouterClasse": function(element, classe) { 
      if (element.className) { 
        element.className += " "; 
      } 

      element.className += classe; 
    }, 

    "nouvelleClasse": "jsActif" 
  }; 
})();

---

无法工作，必须在页面开始处加载J（“#blabla”）.dialog（），否则

form_conso_carb.html

将显示在

vehicleue_parc.php

中，对不起，我感到困惑。我想我误解了你需要做的事。我仍然不确定。包括

J（ID）.dialog（）

我想要的与当前页面上的表ID对应的预定义ID

    function showDialog(element) {
       $(element).dialog({
            autoOpen    : false,
            height      : 'auto',
            width       : 300,
            modal       : true,
            position    : 'middle',
            Cancel  : function() {
                        J(this).dialog( "close" );
                    },
            buttons : {
                "Envoyer"   : function() {

                            }
            }
        });
        }

        J( "#addcc" )
        .button()
        .click(function() {
            showDialog(this);
        });
   }

var bibliJsActif = (function() { 
  // Membres privés 
  function init() { 
    bibliJsActif.ajouterClasse(document.body, bibliJsActif.nouvelleClasse); 
  } 

  if (document.getElementById && document.createTextNode) { 
    window.onload = init; 
  } 

  // Membres publics 
  return { 
    "ajouterClasse": function(element, classe) { 
      if (element.className) { 
        element.className += " "; 
      } 

      element.className += classe; 
    }, 

    "nouvelleClasse": "jsActif" 
  }; 
})();