Node implementiert Suchfeld für Fuzzy-Abfragen
|
In diesem Artikelbeispiel wird der spezifische Code für Node zur Implementierung von Fuzzy-Abfragen im Suchfeld zu Ihrer Information bereitgestellt. Der spezifische Inhalt ist wie folgt 1. NachfrageKlicken Sie auf das Suchsymbol in der Navigationsleiste, um das Suchfeld anzuzeigen, damit Sie eine ungenaue Suche im Artikel durchführen können. 2. Erstellen Sie eine Tabelle1.Blog-Tabelle
Fügen Sie einen Fremdschlüssel hinzu:
2. Navigationstabelle
3.Typ-Tabelle
4.Benutzertabelle
3. Seiten und Stilewie.ejs:
<!DOCTYPE html>
<html lang="de">
<Kopf>
<meta charset="UTF-8">
<meta name="viewport" content="width=Gerätebreite, Anfangsmaßstab=1.0">
<title>Abfrage</title>
<link rel="stylesheet" href="/css/bootstrap.min.css" >
<link rel="stylesheet" href="/css/index.css" >
<script src="js/jquery-3.3.1.min.js"></script>
<script src="js/index.js"></script>
</Kopf>
<Text>
<%-include('detachPart/nav.ejs')%>
<%-include('detachPart/search.ejs')%>
<div Klasse="Container">
<div Klasse="Zeile">
<div Klasse="col-lg-9">
<%-include('bigPart/ownblog.ejs')%>
</div>
<div Klasse="col-lg-3">
<%-include('smallPart/recommend.ejs')%>
<%-include('smallPart/rank.ejs')%>
<%-include('smallPart/rightimg_1.ejs')%>
<%-include('smallPart/information.ejs')%>
<%-include('smallPart/mylink.ejs')%>
</div>
</div>
</div>
<%-include('detachPart/footer.ejs')%>
</body>
</html>suche.ejs:
<div Klasse="Containersucheschließen">
<form action="/like" method="GET">
<input name="link" type="text" placeholder="Bitte geben Sie Schlüsselwörter ein">
<input type="submit" value="Suchen">
<img class="closebtn" src="image/icon/close.png" alt="">
</form>
</div>index.css:
.Suche schließen{
Anzeige: keine;
Position: relativ;
Rand: 0,5rem automatisch;
Polsterung: 1rem 0;
Textausrichtung: zentriert;
Hintergrundfarbe: weiß;
}
.searchclose Eingabe:n-tes-Kind(1){
Breite: 25rem;
Höhe: 2,2rem;
Gliederung: keine;
Schriftgröße: 0,9rem;
Polsterung links: 0,5rem;
Rand: 1px massives Silber;
Box-Größe: Rahmenbox;
vertikale Ausrichtung: Mitte;
}
.searchclose Eingabe:n-tes-Kind(2){
Anzeige: Inline-Block;
Breite: 10rem;
Höhe: 2,2rem;
Zeilenhöhe: 2,2rem;
Hintergrundfarbe: rgb(41, 41, 41);
Farbe: weiß;
vertikale Ausrichtung: Mitte;
Rand: 1px durchgezogen rgb(41, 41, 41);
Rahmenstil: keiner;
Rand links: -1rem;
}
.searchclose img{
Position: absolut;
oben: 0;
rechts: 0;
}Die folgende Datei wird im folgenden Beispiel angezeigt:
$(Funktion(){
$(".searchbtn").klick(function(){
$(".searchclose").anzeigen();
});
$(".closebtn").klick(Funktion(){
$(".searchclose").hide();
});
});MySQL-DatenVerbindung.js:
var mysql = erfordern("mysql");
var Einstellung = erforderlich("./Einstellung");
var-Verbindung;
var Verbindungmysql=Funktion(){
Verbindung = mysql.createConnection({
Host:Einstellung.Host,
Port:Einstellung.Port,
Benutzer:Einstellung.Benutzer,
Passwort:Einstellung.pwd,
Datenbank:Einstellung.Basis
});
}
Verbindungmysql();
exports.select = Funktion (str, Rückruf) {
Verbindungmysql();
Verbindung.Abfrage(str,Funktion(err,res){
wenn(err) throw err;
Rückruf(res);
Verbindung.Ende();
});
}
exports.find = Funktion (str, Parameter, Rückruf) {
Verbindungmysql();
Verbindung.Abfrage(str,Params,Funktion(err,res){
wenn(err) throw err;
Rückruf(res);
Verbindung.Ende();
});
}SQL.js:
module.exports={
findTitle:"Wählen Sie * aus der Navigation aus",
clickRank:"Wählen Sie ID und Titel aus dem Blog aus, sortiert nach Anzahl der Beschreibungen, Limit 7",
recommendInfo:"Wählen Sie ID, Titel, Logo, Empfehlung aus Blog mit Empfehlung=1, Limit 8",
likeBlog:"Wählen Sie blog.id, Titel, Intro, Logo, Zeit, Typ.Typinfo, Benutzergesicht aus Blog, Typ, Benutzer, wobei blog.Typ=Typ.ID und blog.Gesicht=Benutzer-ID und Titel wie? Sortieren nach Zeit absteigend"
}versprechen.js:
var mysql = erfordern("../MySQL/Verbindung");
var sql = erfordern("../MySQL/sql");
module.exports={
Titel suchen:Funktion(){
returniere neues Promise(Funktion(Auflösen){
mysql.select(sql.findTitle,Funktion(Ergebnis){
auflösen(JSON.parse(JSON.stringify(Ergebnis)));
});
})
},
KlickRank:Funktion(){
returniere neues Promise(Funktion(Auflösen){
mysql.select(sql.clickRank,Funktion(Ergebnis){
auflösen(JSON.parse(JSON.stringify(Ergebnis)));
});
});
},
empfehlenInfo:Funktion(){
returniere neues Promise(Funktion(Auflösen){
mysql.select(sql.recommendInfo,Funktion(Ergebnis){
auflösen(JSON.parse(JSON.stringify(Ergebnis)));
});
});
},
likeBlog:Funktion(Nachricht){
returniere neues Promise(Funktion(Auflösen){
mysql.find(sql.likeBlog,msg,Funktion(Ergebnis){
auflösen(JSON.parse(JSON.stringify(Ergebnis)));
});
});
}
}router.js:
var Versprechen = erforderlich("../MySQL/Versprechen");
var url = erfordern("url");
modul.exporte = Funktion (App) {
// Suchfeld für Fuzzy-Suche app.get("/like",function(req,res){
var likeurl=url.parse(req.url,true).query.link;
asynchrone Funktion getData(){
var res1 = warte auf Versprechen.findTitle();
var res5 = warte auf Versprechen.clickRank();
var res11 = warte auf Versprechen.recommendInfo();
var res21 = warte auf Versprechen.likeBlog("%"+likeurl+"%");
var allres = {
Titelindex:0,
navres:res1,
Rangfolge:res5,
empfehlenres:res11,
blogres:res21
}
alles zurückgeben;
}
getData().then(Funktion(Ergebnis){
res.render("Gefällt mir",Ergebnis);
});
});
}Hinweis: Wie blogres:res21 in der Route und blogres:res10 auf der Homepage müssen die auf der Seite wiedergegebenen Datennamen konsistent sein, hier sind sie blogres 5. EffektanzeigeFühren Sie eine Suche durch:
Suchergebnisse:
Das Obige ist der vollständige Inhalt dieses Artikels. Ich hoffe, er wird für jedermanns Studium hilfreich sein. Ich hoffe auch, dass jeder 123WORDPRESS.COM unterstützen wird. Das könnte Sie auch interessieren:
|
>>: Detaillierte Erklärung, wie MySQL Phantom-Lesevorgänge löst
Artikel empfehlen
Detaillierte Erklärung zur Installation von CentOS7 mit der in Win10 integrierten virtuellen Maschine Hyper-V
1. Installieren Sie die virtuelle Maschine Hyper-...
Zusammenfassung der MySQL-Datenbanknutzungsspezifikationen
Einführung: Ich glaube, dass jeder einige Dokumen...
Detaillierte Erklärung von Prototypen und Prototypenketten in JavaScript
Inhaltsverzeichnis Prototyp-Kettendiagramm Grundl...
Detailliertes Tutorial zum Kompilieren und Installieren von MySQL 5.7.24 auf CentOS7
Inhaltsverzeichnis Abhängigkeiten installieren Bo...
Detaillierte Erklärung der Vue-Anmeldung und -Abmeldung
Inhaltsverzeichnis Login-Geschäftsprozess Impleme...
Implementierungsprinzip und Skriptcode der HTML-Rabattpreisberechnung
Code kopieren Der Code lautet wie folgt: <!DOC...
So implementieren Sie On-Demand-Import und globalen Import in Element-Plus
Inhaltsverzeichnis Import auf Anfrage: Globaler I...
Entwicklung von WeChat-Applet-Komponenten: Visuelle Sitzplatzauswahlfunktion im Kino
Inhaltsverzeichnis 1. Einleitung 1. Bauteildaten ...
MySQL-Grundlagen in 1 Stunde
Inhaltsverzeichnis Erste Schritte mit MySQL MySQL...
Eine kurze Diskussion über die MySQL-Optimierungslösung für große Tabellen
Hintergrund Die Menge neuer Daten in der Geschäft...
HTML6 implementiert Beispielcode für Faltmenüs und Akkordeonmenüs
Der Hauptteil der Seite: <body> <ul id=&...
Detaillierte Erklärung des Codes zwischen der MySQL-Masterbibliothek Binlog (Master-Log) und der Slave-Bibliothek Relay-Log
Binärprotokoll der Hauptbibliothek: # bei 2420 #1...
Detailliertes Tutorial zur Integration von Apache Tomcat mit dem IDEA-Editor
1. Laden Sie das komprimierte Tomcat-Paket von de...
Detaillierte Erläuterung der benutzerdefinierten Ereignisinhaltsverteilung von Vue
1. Dies ist etwas kompliziert zu verstehen. Ich h...
Detaillierte Erklärung der Methode getBoundingClientRect() in js
1. getBoundingClientRect() Analyse Die Methode ge...