Heim  >  Artikel  >  Backend-Entwicklung  >  asp.net+jquery-Bildlaufleiste zum Laden der Daten-Dropdown-Steuerung

asp.net+jquery-Bildlaufleiste zum Laden der Daten-Dropdown-Steuerung

高洛峰
高洛峰Original
2017-01-11 10:05:261565Durchsuche

Ich halte diese Forderung nicht für sehr vernünftig, da es so viele Daten gibt, dass das Herunterladen schmerzhaft ist, egal ob es von Menschen oder Maschinen durchgeführt wird.

Aufgrund der Nachfrage gibt es keine Möglichkeit, daher können wir nur entsprechend der Nachfrage agieren. Ich habe im Internet viele entsprechende Steuerelemente gefunden, aber sie schienen alle etwas sperrig zu sein und viele Ressourcen zu beanspruchen. Ich kann nicht einen halben Tag damit verbringen, ein halbfertiges benutzerdefiniertes Steuerelement zu erstellen. Wenn es Experten gibt, die es gesehen haben, geben Sie mir bitte einen Rat.

Anforderung: AJAX-Bildlaufleiste zum Laden einer Dropdown-Liste mit Daten
Steuerelementname: Webcombo
Verwendete Technologie: ASP.NET (C#), jQuery, allgemeine ASP.NET-Verarbeitungsdatei (. ashx)

Spezifische Implementierung der Dropdown-Liste: Verwenden Sie DIV, um eine Dropdown-Liste zu simulieren, Eingabe und Bild, um ein Dropdown-Feld zu simulieren. Das Endergebnis ist wie folgt:

asp.net+jquery-Bildlaufleiste zum Laden der Daten-Dropdown-Steuerung

Analysieren wir zunächst die Schreibmethode des jQuery-Plug-Ins
Das Laden von AJAX wird mit jQuery Ajax abgeschlossen

$.ajax({ 
type: options.getMethod, 
url: options.jsonUrl, 
data: params, 
success: function(data){ 
if(isScroll) 
$.CreateListItem(showbox,data,options); 
else 
$.CreateBox(showbox,data,options); 
}, 
complete:function(){ }, 
error:function(e){ 
$(options.loadBox).css('background-image','none'); 
$(options.loadBox).append(&#39;<span>data connect error!&#39;+e+&#39;</span>&#39;); 
}

Und die Bildlaufleiste Das Scrollen von Daten wird durch das Onscroll-Ereignis des Dropdown-DIV abgeschlossen. Der spezifische Kerncode lautet wie folgt:

$(showbox).scroll(function(){ 
if(options.total==$(this).children("ul").children("li").length) 
return; 
var scrolltop=$(showbox).attr(&#39;scrollTop&#39;); 
var scrollheight=$(showbox).attr(&#39;scrollHeight&#39;); 
var windowheight=$(showbox).attr(&#39;clientHeight&#39;); 
var scrolloffset=20; 
$(options.loadBox).css(&#39;top&#39;,scrolltop); 
if(scrolltop>=(scrollheight-(windowheight+scrolloffset))&&!loading) 
{ 
loading=true; 
$(options.loadBox).show(); 
options.total=$(this).children("ul").children("li").length; 
$.WebComboGetData(showbox,options,true); 
} 
});

Für mehr asp.net+jquery Scrollen Sie mit der Dropdown-Steuerung der Bildlaufleiste, um Artikel zum Laden von Daten zu lesen. Bitte beachten Sie die chinesische PHP-Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn