我有这样的代码，但在打开模态时，它给了我一个错误：
参考错误：$未定义
有人能帮帮我吗？
首先是表单，最后是模态，然后是jquery脚本。
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"
rel="stylesheet" integrity="sha384-
EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="./assets/css/style.css">
<link rel="icon" type="image/jpg" href="./assets/img/cocinando.png" />
<title>Mi recetario personal</title>
</head>
<body>这将是成功时出现的模态
<button id="abrirModalCorrecto" type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#modalCorrecto" style="display:none;">
</button>
<div class="modal fade" id="modalCorrecto" tabindex="-1" aria-labelledby="exampleModalLabelCorrecto" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabelCorrecto">Información</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-
label="Close"></button>
</div>
<div class="modal-body">
Receta insertada correctamente.
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-
dismiss="modal">Cerrar</button>
</div>
</div>
</div>
</div>这将是出现错误时出现的模态。
<button id="abrirModalError" type="button" class="btn btn-primary" data-bs-
toggle="modal" data-bs-target="#modalError" style="display:none;">
</button>
<div class="modal fade" id="modalError" tabindex="-1" aria-
labelledby="exampleModalLabelError" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabelError">Error</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-
label="Close"></button>
</div>
<div class="modal-body">
Todos los campos son obligatorios
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-
dismiss="modal">Cerrar</button>
</div>
</div>
</div>
</div>
<script>
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
console.log(urlParams);
//Si error existe porque todos los campos no están rellenos, abre el modal ERROR
if (urlParams.get("error") != null && urlParams.get("error") == "1") {
//alert("Todos los campos son obligatorios");
$("#abrirModalError").click();
}
</script>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"
></script>
<!-- <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script> -->
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js">
</script>
</body>
</html>
1条答案
按热度按时间nc1teljy1#
您需要在页面的
<head>部分或者在任何使用jQuery的自定义脚本之前加载jQuery。要修复它，请移动到您的head元素。