In der Vergangenheit habe ich Javascript selten zum Implementieren von Seitenfunktionen verwendet, hauptsächlich weil ich Angst vor Problemen hatte. Nachdem ich jedoch etwas über JQuery gelernt hatte, änderte sich diese Idee mit einer solchen Skriptkomponente. Es ist praktisch, sie beim Schreiben von Skripten von HTML zu isolieren , so dass das Schreiben in hohem Maße wiederverwendbar ist. Das Folgende ist eine Einführung in das wiederverwendbare Skript, das auf Ajax-Datenabfrage-, Sortier- und Paging-Funktionen basiert, die beim Erlernen von JQuery geschrieben wurden. Solange Sie bestimmte Regeln des Skripts befolgen, um HTML zu beschreiben und die Skriptdatei einzuführen, können Sie sie problemlos implementieren die oben beschriebenen Funktionen.
Sehen wir uns zunächst den Code zum Implementieren der Funktion an:
/**应用脚本规则：
引用脚本: JQuery脚本和JQuery的form插件脚本
Form的ID: viewform
显示数据的p的ID: listview
分页按钮HTML属性: pageindex="1"
排序按钮HTML属性: orderfield="employeeid desc";
提效排序字段Input的ID,Name: orderfield
提交分页索引Input的ID,Name: pageindex
**/
function onInitPaging()
{
$("#listview").find("[@orderfield]").each(function(i)
{
var ordervalue = $(this).attr("orderfield");
$(this).click(function()
{
$("#orderfield").val(ordervalue);
onSubmitPage();
}
);
}
);
$("#listview").find("[@pageindex]").each(function(i)
{
var piValue = $(this).attr("pageindex");
$(this).click(function()
{
$("#pageindex").val(piValue);
onSubmitPage();
}
);
}
);
}
function onSubmitPage()
{
var options = {
success: function SubmitSuccess(data){
$("#listview").html(data);
onInitPaging();
}
};
$('#viewform').ajaxSubmit(options);
}
$(document).ready(
function()
{
$("#search").click(function(){
$("#pageindex").val('0');
onSubmitPage()
});
onSubmitPage();
}
);Die Einschränkungsregeln nutzen geschickt die benutzerdefinierten Attribute von HTML Der obige Code beschreibt die Ajax-Übermittlungsverarbeitung für Abfrage, Sortierung und Paginierung. Befolgen Sie beim Schreiben von HTML einfach die beschriebenen Regeln. Sie müssen keinen Skriptcode schreiben;
