Ich möchte alle Tabellenlisten aus einer Datenbank im Dropdown-Menü anzeigen und dem Benutzer erlauben, den Tabellennamen auszuwählen. Wenn der Benutzer den Tabellennamen auswählt, möchte ich alle Daten anzeigen. HTML-Datei ist so
<!DOCTYPE html>
<html>
<head>
<script src="jquery.js"></script>
<script>
$(document).ready(function(){
$.ajax({url:"home.php?id=1",
success:function(result){
$("#div1").html(result);
}});
$("#dropdown").change(function(){
alert("list item selected");
$.ajax({url:"home.php?id=2&tablename="+tableForm.tableLists.value,
success:function(result){
$("#div2").html(result);
}});
});
});
</script>
</head>
<body>
<button value="add" >
<form name="tableForm">
<div id="div1"></div>
</form>
</button>
<br><hr>
<div id="div2"></div>
</body>
Diese Seite wird in Ordnung ausgeführt und zeigt eine Liste aller zur Datenbank gehörenden Tabellennamen an. aber wenn ich einen Wert aus der Dropdown-Liste auswähle, alarmiert es nicht einmal die "Listenelement ausgewählt" Nachricht. Was tun, damit es funktioniert?
Hier ist ein Bild der Dropdown-Liste 
3 Antworten
Es sieht so aus, als ob das Dropdown-Feld dynamisch in die Seite geladen wird. Sie müssen die Funktion also mit .on() an das dynamisch hinzugefügte Element binden:
$(document).on('change', '#dropdown', function(){
console.log("list item selected");
// do whatever here
});
Da Ihr Code darauf hinweist, dass Sie Ihre Dropdown-Liste dynamisch füllen und in Ihrem Code ein lokales Ereignis angeben, das nicht funktioniert, gibt es mehrere andere Ereignishandler wie .on .bind .live usw., wenn Ich muss in einer solchen Situation arbeiten. Ich würde definitiv lieber .on oder .live verwenden, also muss Ihr Code wie folgt aussehen:
$("#dropdown").live('change',function(){
alert("list item selected");
$.ajax({
url:"home.php?id=2&tablename="+tableForm.tableLists.value,
success:function(result){
$("#div2").html(result);
}
});
});
Oder dieses:
$("#dropdown").on('change',function(){
alert("list item selected");
$.ajax({
url:"home.php?id=2&tablename="+tableForm.tableLists.value,
success:function(result){
$("#div2").html(result);
}
});
});
Ich denke, Dropdown-Box wird dynamisch in die Seite geladen. Sie können so verwenden
$("#dropdown").on('change',function(){
alert("hoi");
$.ajax({url:"home.php?id=2&tablename="+tableForm.tableLists.value,
success:function(result){
$("#div2").html(result);
}});
});