使用jQuery組件

通訊我創建了一個jQuery的圖形組件，但我不知道如何，甚至在谷歌搜索...使用jQuery組件

這個想法是一個JavaScript函數，使我的組件的函數的調用。

下面是簡單的創建結構：

(function ($, w) { 

$.fn.TableFullOption = function (options) { 
    var settings = $.extend(true, {}, { FiltreGeneral: false, BtnReset: false, Datas: {}, Head: "", Body: "", Delete: "", Add: "", Modify: "", Details: "", AvecPager: false, Selectable: false, LstPageSize: '10;20;30;40', Default: [], LargeurColonne: [], HauteurTotale: 800, FiltreColonne: [], TriColonne: [], NomColonne: [], ObligColonne: [], ModifColonne: [], AddColonne: [] }, options); 
    if ((settings.Head == "") || (settings.Body == "")) { $(this).html('Erreur de paramétrage'); } 
    else { 
     ... 
    } 
}; 
function GetInfo(){return true;} 
}(jQuery));

的調用我的組件

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title></title> 
<link href="/CSS/ui-lightness/jquery-ui.min.css" rel="stylesheet" /> 
<link href="/TableFullOptionPlugin/Table.css" rel="stylesheet" /> 
<script type="text/javascript" src="/script/jquery.js"></script> 
<script type="text/javascript" src="/script/jquery-ui.min.js"></script> 
<script type="text/javascript" src="/script/MsgResult.js"></script> 
<script type="text/javascript" src="/TableFullOptionPlugin/eleve.js"> </script> 
<script type="text/javascript" src="/TableFullOptionPlugin/TFOPlugin.js"></script> 
<script type="text/javascript"> 
    $(function() { 
     $('#divTable').TableFullOption({ 
      BtnReset: true, 
      FiltreGeneral: true, 
      Head: '/TableFullOptionPlugin/TFOPlugin.aspx/GetStructTable', 
      Body: '/TableFullOptionPlugin/TFOPlugin.aspx/GetlstEleve', 
      Delete: '/TableFullOptionPlugin/TFOPlugin.aspx/DeleteEleve', 
      Add: '/TableFullOptionPlugin/TFOPlugin.aspx/AddEleve', 
      Modify: '/TableFullOptionPlugin/TFOPlugin.aspx/ModEleve', 
      Details: '/TableFullOptionPlugin/Details.aspx', 
      Selectable: true, 
      AvecPager: true, 
      LstPageSize: '10;20;30;40', 
      LargeurColonne: [60, 100, 80, 80, 80, 90, 70, 110, 110, 75, 75], 
      FiltreColonne: [true, true, true, true, true, false, false, false, true, true, true], 
      TriColonne: [true, true, true, true, false, false, false, false, true, true, true], 
      ObligColonne: [false, true, true, false, false, false, false, false, true, false, false], 
      ModifColonne: [false, true, true, true, false, true, false, false, true, false, false], 
      AddColonne: [false, true, true, true, true, false, false, false, true, false, false], 
      Default: [null, null, null, null, null, null, null, null, null, false, ValdefManu], 
      NomColonne: ["Logo", "Eleve", "Majeur", "Sexe", "Anglais", "Japonais", "Calcul", "Géométrie", "Dte Naissance", "Auto", "Manuel"], 
      HauteurTotale: 700 
     }); 

    }); 
</script> 
</head> 
<body> 
<div id="divTable"></div> 

</body> 
</html>

我試圖$('#divTable').TableFullOption().GetInfo();但它不運行。我不知道如何做一個功能或打電話給我的功能GetInfo並有我的迴應。

來源

2015-04-18 YannickIngenierie

你能澄清你的問題嗎？目前還不清楚你實際上想要實現什麼 – thrau

我想通過我的插件中的函數詢問一些信息。但我不知道如何訪問我 – YannickIngenierie

以外的函數我找到了一個部分** $ .fn.TableFullOption.GetInfo = function（）{return true; }; **和ouside call ** $（'＃div1'）。TableFullOption.GetInfo（）**現在我的問題是如何訪問我的特定div1（而不是其他div）的信息我嘗試$（this）但不運行 – YannickIngenierie

與其他論壇幫助我的樣品插件（Plugin.js）是

(function ($, w) { 
$.fn.BK = function (options) { 
    if (typeof options === "string") { 
     return $(this).data("BK")[options].apply(this, [].splice.call(arguments, 1)); 
    } 
    var settings = $.extend(true, {}, { 
     BkG: 'yellow', 
     GetInfo: function() { return $(this).data("BK").BkG } 
    }, options); 


    $(this).data("BK", settings).css("background", settings.BkG); 
    return this 
}; 
}(jQuery));

和呼叫：eleve.js

$(function() { 
$('#btnGetSel').button().click(function() { 
    alert($('#div1').BK("GetInfo")) 
    alert($("#div2").data("BK").BkG) 
    return false; 
}); 
});

我的html頁面：

<head runat="server"> 

<script type="text/javascript" src="/script/jquery.js"></script> 
<script type="text/javascript" src="/PluginJquery/eleve.js"></script> 
<script type="text/javascript" src="/PluginJquery/Plugin.js"></script> 
<script type="text/javascript"> 
    $(function() { 
     $('#div').BK({ 
      BkG: 'red' 
     }); 

     $('#div1').BK({ 
      BkG: 'blue' 
     }); 
     $('#div2').BK(); 
    }); 
</script> 
</head> 
<body> 
<div id="div">blabla</div> 
<div id="div1">blabla</div> 
<div id="div2">blabla</div> 
<div style="margin-top: 50px;"> 
    <button id="btnGetSel">Valider</button> 
</div> 
</body>

來源

2015-04-20 13:56:24 YannickIngenierie

使用jQuery組件

回答

相關問題