2010-03-30 42 views
1

海這是我的jQuery的功能,如何使這個jquery函數可重用?

function getRecordspage(curPage, pagSize) { 
    $.ajax({ 
     type: "POST", 
     url: "Default.aspx/GetRecords", 
     data: "{'currentPage':" + curPage + ",'pagesize':" + pagSize + "}", 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     success: function(jsonObj) { 
      var strarr = jsonObj.d.split('##'); 
      var jsob = jQuery.parseJSON(strarr[0]); 
      $.each(jsob.Table, function(i, employee) { 
       $('<div class="resultsdiv"><br /><span class="resultName">' + employee.Emp_Name + '</span><span class="resultfields" style="padding-left:100px;">Category&nbsp;:</span>&nbsp;<span class="resultfieldvalues">' + employee.Desig_Name + '</span><br /><br /><span id="SalaryBasis" class="resultfields">Salary Basis&nbsp;:</span>&nbsp;<span class="resultfieldvalues">' + employee.SalaryBasis + '</span><span class="resultfields" style="padding-left:25px;">Salary&nbsp;:</span>&nbsp;<span class="resultfieldvalues">' + employee.FixedSalary + '</span><span style="font-size:110%;font-weight:bolder;padding-left:25px;">Address&nbsp;:</span>&nbsp;<span class="resultfieldvalues">' + employee.Address + '</span></div>').appendTo('#ResultsDiv'); 
      }); 
      $(".resultsdiv:even").addClass("resultseven"); 
      $(".resultsdiv").hover(function() { 
       $(this).addClass("resultshover"); 
      }, function() { 
       $(this).removeClass("resultshover"); 
      }); 
     } 
    }); 
} 

在我的網頁我有這樣的jQuery腳本,

$("#lnkbtn0").click(function() { 
       getRecordspage(1, 5) 
      }); 

我的頁面有

<a ID="lnkbtn0" class="page-numbers">1</a>
<a ID="lnkbtn1" class="page-numbers">2</a>
<a ID="lnkbtn2" class="page-numbers">3</a>
<a ID="lnkbtn3" class="page-numbers">4</a>

如何讓其他的鏈接按鈕來調用與差異curPage參數此功能...

回答

2

我想你的意思是你想申請的ID爲鏈接文本與linkbtn作爲第一個參數開始:

$("a[id^=linkbtn]").click(function() { 
    getRecordspage($(this).text(), 5); 
    return false; 
}); 

http://api.jquery.com/attribute-starts-with-selector/

或者,你可以只使用一類選擇:

$("a.page-numbers").click(function() { 
    getRecordspage($(this).text(), 5); 
    return false; 
}); 
+0

@Karim that worked ..... – 2010-03-30 09:54:07

+0

+1,非常簡單,不像我.... :)頁碼的方式更好。 – 2010-03-30 09:56:03

1

如果你不介意使用普通老式的JavaScript

<a ID="lnkbtn0" class="page-numbers" href="#" onclick="getRecordsPage(1,5)">1</a> 
<a ID="lnkbtn1" class="page-numbers" href="#" onclick="getRecordsPage(2,5)">2</a> 
<a ID="lnkbtn2" class="page-numbers" href="#" onclick="getRecordsPage(3,5)">3</a> 
<a ID="lnkbtn3" class="page-numbers" href="#" onclick="getRecordsPage(4,5)">4</a> 

確保您在<a>標籤preventDefault

否則,如果你真的想去JQuery。

$("a[id^=linkbtn]").each(function() { 
    $(this).click(function() { 
     getRecordspage($(this).text(), 5); 
    }); 
}); 

UPDATE使用類選擇(如karim79)建議。

+0

@Elite我會用jQuery去我應該使用href =「#」作爲我的主播 – 2010-03-30 09:56:38

+0

如果沒有找到'href',一些瀏覽器刷新頁面。你可以做'href =「javascript:void(0)」'實質上什麼都不做。它基本上取決於你選擇你想要的瀏覽器。 – 2010-03-30 09:59:06