Javascript 带有laravel 8x+的顺风弹出窗口；Jetstream做得不好
此按钮随机获取ID而不是指定的ID，当我按下关闭按钮时，随机ID的状态更改开始，但我在表单中传递poll->ID 我不明白js怎么了Javascript 带有laravel 8x+的顺风弹出窗口；Jetstream做得不好,javascript,laravel,popup,tailwind-css,Javascript,Laravel,Popup,Tailwind Css,此按钮随机获取ID而不是指定的ID，当我按下关闭按钮时，随机ID的状态更改开始，但我在表单中传递poll->ID 我不明白js怎么了 <td border-0 px-4 py-6> <body class="bg-gray-200 flex items-center justify-center h-screen"> <button class="modal-open bg-transparent hover:bg-r
<td border-0 px-4 py-6>
<body class="bg-gray-200 flex items-center justify-center h-screen">
<button class="modal-open bg-transparent hover:bg-red text-red-dark font-semibold hover:text-red py-2 px-4 border border-red hover:border-transparent rounded">
change
</button>
<!--Modal-->
<div class="modal opacity-0 pointer-events-none fixed w-full h-full top-0 left-0 flex items-center justify-center">
<div class="modal-overlay absolute w-full h-full bg-gray-900 opacity-50"></div>
<div class="modal-container bg-white w-11/12 md:max-w-md mx-auto rounded shadow-lg z-50 overflow-y-auto">
<div class="modal-close absolute top-0 right-0 cursor-pointer flex flex-col items-center mt-4 mr-4 text-white text-sm z-50">
<svg class="fill-current text-white" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
<path d="M14.53 4.53l-1.06-1.06L9 7.94 4.53 3.47 3.47 4.53 7.94 9l-4.47 4.47 1.06 1.06L9 10.06l4.47 4.47 1.06-1.06L10.06 9z"></path>
</svg>
<span class="text-sm">(Esc)</span>
</div>
<!-- Add margin if you want to see some of the overlay behind the modal-->
<div class="modal-content py-4 text-left px-6">
<!--Title-->
<div class="flex justify-between items-center pb-3">
<p class="text-2xl font-bold">change</p>
<div class="modal-close cursor-pointer z-50">
<svg class="fill-current text-black" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
<path d="M14.53 4.53l-1.06-1.06L9 7.94 4.53 3.47 3.47 4.53 7.94 9l-4.47 4.47 1.06 1.06L9 10.06l4.47 4.47 1.06-1.06L10.06 9z"></path>
</svg>
</div>
</div>
<!--Body-->
<form method='POST' action="{{ route('change',['poll'=>$poll]) }}">
@csrf
@method('PUT')
<div class="field mb-8">
<div class='control'>
<div class="bg-teal-100 border-t-4 border-teal-500 rounded-b text-teal-900 px-4 py-3 shadow-md bg-gray-400" role="alert">
<div class="flex">
<p class="text-3xl m-8">you are changing the status of ID: {{$poll->id}} are you sure you want to proceed? </p>
</div>
</div>
</div>
</form>
<!--Footer-->
<button class="bg-transparent hover:bg-red text-red-dark font-semibold ">
OK
</button>
<button class="modal-close bg-transparent hover:bg-red text-red-dark">Close</button>
</div>
</div>
</div>
</div>
<script>
var openmodal = document.querySelectorAll('.modal-open')
for (var i = 0; i < openmodal.length; i++) {
openmodal[i].addEventListener('click', function(event){
event.preventDefault()
toggleModal()
})
}
const overlay = document.querySelector('.modal-overlay')
overlay.addEventListener('click', toggleModal)
var closemodal = document.querySelectorAll('.modal-close')
for (var i = 0; i < closemodal.length; i++) {
closemodal[i].addEventListener('click', toggleModal)
}
document.onkeydown = function(evt) {
evt = evt || window.event
var isEscape = false
if ("key" in evt) {
isEscape = (evt.key === "Escape" || evt.key === "Esc")
} else {
isEscape = (evt.keyCode === 27)
}
if (isEscape && document.body.classList.contains('modal-active')) {
toggleModal()
}
};
function toggleModal () {
const body = document.querySelector('body')
const modal = document.querySelector('.modal')
modal.classList.toggle('opacity-0')
modal.classList.toggle('pointer-events-none')
body.classList.toggle('modal-active')
}
</script>
</td>
改变
（Esc）
更改
@csrf
@方法（'PUT'）
您正在更改ID的状态：{{{$poll->ID}}是否确实要继续
好啊
接近
var openmodal=document.querySelectorAll（'.modal open'）
对于（变量i=0；i