gpt4 book ai didi

php - 提交按钮不适用于 fancybox

转载 作者:行者123 更新时间:2023-11-28 02:36:31 26 4
gpt4 key购买 nike

我在点击链接时打开了一个花式框。

这个花哨的盒子有用户名和密码,我想在点击提交按钮时对其进行身份验证。(为了简化,我现在只将花哨的盒子更改为提交按钮)

我已经编写了一个 php 代码,它应该在 fancybox 或 html 页面上(不确定确切位置)显示 hello,但它没有显示。

如何在 fancybox 或 html 页面上单击提交按钮时打招呼?

我不想使用 ajax 调用,但是如果没有 ajax 调用是不可能的,那么在这种情况下如何使用 ajax?

//p.php

<html>
<head>

<style>
#hidden-content-b
{
/* Custom styling */
max-width: 850px;
border-radius: 40px;

/* Custom transition - slide from top*/
transform: translateY(-50px);
transition: all .33s;
}

.fancybox-slide--current #hidden-content-b
{
transform: translateY(0);
}

</style>

<link rel="stylesheet" type="text/css" href="fancybox-master/dist/jquery.fancybox.min.css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="fancybox-master/dist/jquery.fancybox.min.js"></script>

</head>

<body>

<h2>fancyBox v3.1 - Inline content</h2>
<form action = "p.php" method = "post">
<div class="grid">

<p>
<a data-fancybox data-src="#hidden-content-a"
href="javascript:;" class="btn">Open demo</a>
</p>

<div style="display: none;" id="hidden-content-a">
<center>
<h1><b>HTML</b></h1>
<input type = "submit" value = "Submit" name = "submit">
</center>
</div>

<?php
if(isset($_POST['submit']))
echo "hello";
?>

</div>

</form>
</body>
</html>

最佳答案

当您使用 fancyBox 显示某些内容时,它会从其位置移动,因此它不在您的表单中。你只需要改变顺序 元素,以便您的内容包含表单,例如:

<div class="grid">

<p>
<a data-fancybox data-src="#hidden-content-a"
href="javascript:;" class="btn">Open demo</a>
</p>

<div style="display: none;" id="hidden-content-a">
<form action="p.php" method="post">
<center>
<h1><b>HTML</b></h1>
<input type="submit" value="Submit" name="submit">
</center>
</form>
</div>

</div>

关于php - 提交按钮不适用于 fancybox,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46991456/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com