Как решить эту «Uncaught ReferenceError: $ не определено»
У меня есть код, в котором мне нужно обновить столбец таблицы (MySQL), вызывая другой файл php, не покидая страницы, где некоторые таблицы могут разрешать встроенное редактирование.
У меня есть точка в php-эхо страницы, где можно щелкнуть значок, чтобы сохранить ввод. Код на тот момент такой:
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<?php
$sql = "SELECT * FROM table WHERE a_column='certain_value'";
if (mysqli_query($conn, $sql)) {
$result = mysqli_query($conn, $sql);
if (mysqli_num_rows($result) > 0) {
while($row = mysqli_fetch_assoc($result)) {
$note = $row["note"];
$code = $row["code"];
}
}
}
// some tabled elements not relevant for the issue
echo "<input type='text' id='note_1' name='note_1' value=$note readonly>";
echo "<input type='text' id='new_note' name='new_note'>";
echo "<img src='icon_to_click.png' id='icon_to_click' name='icon_to_click' >";
?>
<script type = "text/javascript">
$(document).ready(function() {
$('#icon_to_click').click(function() {
var note_orig = document.getElementById('note_1').value;
var code_val = '<?php echo "$code" ?>';
var note_new = document.getElementById('new_note').value;
if (note_new != note_orig) {
$.ajax({
type: 'POST',
url: 'update_notes.php',
data: {'code': code_val, 'note': note_new},
success: function(response){
document.getElementById('note_1').value = note_new;
}
});
}
});
});
Соответствующий код update_notes.php:
<?php
// connection
$unsafe_note = $_POST["note"];
$code = $_POST["code"];
require "safetize.php"; // the user input is made safe
$note = $safetized_note; // get the output of safetize.php
$sqlupdate = "UPDATE table SET note='$note' WHERE code='$code'";
if (mysqli_query($conn, $sqlupdate)) {
echo "Note updated";
} else {
echo "Problem in updating";
}
// close connection
?>
Теперь, когда я запускаю код и смотрю на инструмент, он выдает ошибку: Uncaught ReferenceError: $ не определен, связывая ошибку с этой строкой предыдущего кода js:
$(document).ready(function() {
Итак, как я могу это исправить?
Похоже, ваш код запускается до загрузки jquery. Попробуйте изменить код document.ready на document.addEventListener('DOMContentLoaded', (event) => { //the event occurred })
Вы уверены, что включили jQuery в свой HTML?
@ Anis R.: как видно из кода, <script src = "ajax.googleapis.com/ajax/libs/jquery/3.2.1/…> может загрузить jQuery
@ Дмитрий Гуз: не могли бы вы изложить для меня более процедурно?
Я также пробовал $(window).on('load', function() вместо $(document).ready(function() , но ничего не изменилось
@ Hien Nguyen: готово, при нажатии на ошибку появляется «анонимная функция».
Возможный дубликат Uncaught ReferenceError: $ не определен?
@gab проверьте из консоли, что jQuery был правильно загружен. Похоже не загружается
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Эй, я столкнулся с той же ошибкой днем ранее, это потому, что вы пропустили использование необходимого скрипта библиотеки jquery. пожалуйста, попробуйте использовать обновленный Jquery CDN. :) Это определенно поможет ИЛИ включите файл jquery.js перед любыми файлами плагинов jquery.
Я нашел опечатку в одном из включенных файлов перед вызовом jquery, включая вызов, и это было причиной неправильной работы jquery. Но тем не менее некоторые мелкие проблемы все же были
Это означает, что вы пытались использовать Jquery в своем коде Javascript без вызова библиотеки Jquery или код вызывается без полной загрузки библиотеки.
Я заметил :
- Что вы не закрыли свой тег сценарий
- Вы используете Jquery, поэтому вы можете использовать
$('#id_name')для выбора элемента по идентификатору вместоdocument.getElementById('note_1') - Получите значение элемента, используя
Element.val()вместоElement.value
Попробуйте отредактировать код следующим образом
<?php
$sql = "SELECT * FROM table WHERE a_column='certain_value'";
if (mysqli_query($conn, $sql)) {
$result = mysqli_query($conn, $sql);
if (mysqli_num_rows($result) > 0) {
while($row = mysqli_fetch_assoc($result)) {
$note = $row["note"];
$code = $row["code"];
}
}
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset = "UTF-8">
<title>Some title</title>
</head>
<body>
<form method = "post" accept-charset = "UTF-8">
<input type='text' id='note_1' name='note_1' value=<?= $code ?> readonly>";
<input type='text' id='new_note' name='new_note'>";
<img src='icon_to_click.png' id='icon_to_click' name='icon_to_click' >";
</form>
<script>
$(document).ready(function() {
$('#icon_to_click').click(function() {
var note_orig = $('#note_1').val();
var code_val = '<?= $code ?>';
var note_new = $('#new_note').val();
if (note_new != note_orig) {
$.ajax({
type: 'POST',
url: 'update_notes.php',
data: {'code': code_val, 'note': note_new},
success: function(response){
$('#note_1').val() = note_new;
}
});
}
});
});
</script>
</body>
</html>
Element.value устарел в пользу element.val(), или это просто неправильный синтаксис?
попробуйте Ctrl + F5 и увидите ошибку на вкладке консоли