英文:
Input text with autocomplete - Uncaught TypeError: $.ajax is not a function in PHP, MySQL and jQuery
问题
我正在尝试在jQuery中使用PHP和MySQL从数据库中获取用户信息来创建一个自动完成文本输入框。我遇到了以下错误:
Uncaught TypeError: $.ajax is not a function
at HTMLInputElement.<anonymous> (file.php:332)
at HTMLInputElement.dispatch (jquery-3.3.1.slim.min.js:2)
at HTMLInputElement.v.handle (jquery-3.3.1.slim.min.js:2)
我在所有页面中包含的header.php
文件中导入了jQuery:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
这是我的file.php
文件,其中包含脚本和输入部分,我只会留下部分代码,当然,输入框位于一个表单内:
<input type="text" name="autor" id="autor" placeholder="Escreve o nome do autor" />
<div id="autorLista"></div>
<script>
$(document).ready(function() {
$('#autor').keyup(function() {
var query = $(this).val();
console.log(query);
if (query != '') {
$.ajax({
url: "./components/search.php",
method: "POST",
data: {
query: query
},
success: function(data) {
$('#autorLista').fadeIn();
$('#autorLista').html(data);
}
});
}
});
$(document).on('click', 'li', function() {
$('#autor').val($(this).text());
$('#autorLista').fadeOut();
});
});
</script>
我甚至不知道PHP代码是否正常工作,但我认为是的。我将在下面留下它(search.php
):
<?php
if (isset($_POST['query'])) {
$link = new_db_connection();
$stmt = mysqli_stmt_init($link);
$output = '';
$query = "SELECT id_user, nome_user FROM users WHERE nome_user LIKE ?";
if (mysqli_stmt_prepare($stmt, $query)) {
$output = "<ul>";
if (mysqli_stmt_num_rows($stmt) > 0) {
mysqli_stmt_bind_param($stmt, 's', $nome_user);
mysqli_stmt_execute($stmt);
mysqli_stmt_bind_result($stmt, $id_user, $nome_user);
if (mysqli_stmt_fetch($stmt)) {
$output .= "<li>" . $nome_user . "</li>";
}
} else {
$output = '<li>O utilizador que procura não existe.</li>';
}
$output .= "</ul>";
echo $output;
} else {
echo 'erro';
}
}
我已经尝试更改jQuery版本,检查了slim版本等等,但都没有使它工作...有什么想法吗?如果有任何疑问或者如果我表述不清楚,请告诉我。谢谢!
英文:
I'm trying to do a autocomplete text input in jQuery with user information from database in PHP and MySQL.
I'm getting the following error:
Uncaught TypeError: $.ajax is not a function
at HTMLInputElement.<anonymous> (file.php:332)
at HTMLInputElement.dispatch (jquery-3.3.1.slim.min.js:2)
at HTMLInputElement.v.handle (jquery-3.3.1.slim.min.js:2)
I import jQuery on header.php that is included in all pages:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
This is my file.php which is the file with the script and the input, I'll leave just a part of the code, of course the input is inside a form
<input type="text" name="autor" id="autor" placeholder="Escreve o nome do autor" />
<div id="autorLista"></div>
<script>
$(document).ready(function() {
$('#autor').keyup(function() {
var query = $(this).val();;
console.log(query);
if (query != '') {
$.ajax({
url: "./components/search.php",
method: "POST",
data: {
query: query
},
success: function(data) {
$('#autorLista').fadeIn();
$('#autorLista').html(data);
}
});
}
});
$(document).on('click', 'li', function() {
$('#autor').val($(this).text());
$('#autorLista').fadeOut();
});
});
</script>
I don't even know if php code is working correctly but I think it is. I'll leave it below (search.php):
<?php
if (isset($_POST['query'])) {
$link = new_db_connection();
$stmt = mysqli_stmt_init($link);
$output = '';
$query = "SELECT id_user, nome_user FROM users WHERE nome_user LIKE ?";
if (mysqli_stmt_prepare($stmt, $query)) {
$output = "<ul>";
if (mysqli_stmt_num_rows($stmt) > 0) {
mysqli_stmt_bind_param($stmt, 's', $nome_user);
mysqli_stmt_execute($stmt);
mysqli_stmt_bind_result($stmt, $id_user, $nome_user);
if (mysqli_stmt_fetch($stmt)) {
$output .= "<li>" . $nome_user . "</li>";
}
} else {
$output = '<li>O utilizador que procura não existe.</li>';
}
$output .= "</ul>";
echo $output;
} else {
echo 'erro';
}
}
I've tried changing versions of jquery, checked the slim version, etc and nothing makes this work... Any idea, please? Any doubts or if I wasn't clear, just tell me please. Thank you!
答案1
得分: 1
In your error it is showing you are using jQuery slim, which doesn't have Ajax.
Please check you are using ONLY normal jQuery, not the slim version.
英文:
In your error it is showing you are using jQuery slim, which doesn't have Ajax.
> (jquery-3.3.1.slim.min.js:2)
Please check you are using ONLY normal jQuery, not the slim version.
答案2
得分: 0
I was importing a slim version when importing bootstrap because it was suggested on their webpage.
现在我使用这个
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
而不是
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
英文:
I was importing a slim version when importing bootstrap because it was suggested on their webpage.
Now I'm using this
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
Instead of
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论