我是Jquery的初学者,我尝试做一些简单的例子练习, 在这个例子中,我试图从php表单发送POST var到我在互联网上找到的Jquery modale popup。
我的问题是,当我点击提交链接发送我的php表单时,我无法将我的表单var发送到我的modale弹出窗口,
在我的案例$ name中,弹出窗口显示没有var。
这是我的代码:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="test.css" />
<script type="text/javascript" src="script.js"></script>
<form method = "POST" id = "formm" name="form1" action="recep.php" >
<input type="text" name="nom"/> <br>
<a href="#?w=500" rel="popup_name" class="poplight" name="nom" onclick="openwindow(this)";">test</a><br>
</form>
最后我的script.js :
$(document).ready(function() {
$('a.poplight[href^=#]').click(function() {
var popID = $(this).attr('rel'); //Trouver la pop-up correspondante
var popURL = $(this).attr('href'); //Retrouver la largeur dans le href
//Récupérer les variables depuis le lien
var query= popURL.split('?');
var dim= query[1].split('&');
var popWidth = dim[0].split('=')[1]; //La première valeur du lien
$('#' + popID).fadeIn().css({
'width': Number(popWidth)
})
.prepend('');
var popMargTop = ($('#' + popID).height() + 80) / 2;
var popMargLeft = ($('#' + popID).width() + 80) / 2;
$('#' + popID).css({
'margin-top' : -popMargTop,
'margin-left' : -popMargLeft
});
$('body').append('');
//Apparition du fond - .css({'filter' : 'alpha(opacity=80)'})
$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn();
return false;
});
$('a.close, #fade').live('click', function() { //Au clic sur le bouton ou sur le calque...
$('#fade , .popup_block').fadeOut(function() {
$('#fade, a.close').remove();
});
return false;
});
});
});
<div id="popup_name" class="popup_block">
<h2>Developpez.com</h2>
<p>Soh Tanaka est traduit sur dev.com.<?php if (isset($_POST['nom'])) { $nom = $_POST['nom']; echo 'la var est'.$nom; } ?></p>
</div>
我想我必须在我的script.js中添加submit()条件,因为当我点击我的链接时Jquery只选择href,但他不提交表单。
任何想法? :(
谢谢!!!
答案 0 :(得分:0)
看起来试图发送一个表单,但你没有提交它,你试图在你的recep.php上获得的值是在一个无法发送的锚点上!此外,输入和锚都具有名称=“nom”。单击锚点时,还会调用两个函数。所以你想分开很多事情。
首先,你应该决定是否使用jQuery,javascript或两者来调用你需要的任何函数。 如果你正在使用Jquery,你需要一种方法来在页面加载时使用
来调用元素。$('.whateverClass').click(function() { etc });
在这种情况下,我会使用class或id属性。 如果您正在使用onclick,那么您将调用javascript函数。在这种情况下,您应该将所需的所有参数作为数组传递
onclick="callTheFunction(this , '{put an array here with what you want?}')"
因此,此锚点将位于表单的底部,但不会成为表单的一部分。没关系,因为你不想提交表单...你想从表单中获取所有的表,然后使用jQuery或javascript hhtp post / get request将值传递到服务器。
因为您想使用jQuery,所以请执行类似
的操作<input type="text" name="nameField" id="nameInput" /> <br>
<a href="#?w=500" rel="popup_name" id="popLight">test</a> <br>
<script>
$(document).ready(function() {
$('.popLight').click(function() {
//Get the form input value
var nameInput = $('#nameInput').val();
//Get the anchor attributes
var href = $('#popLight').attr('href');
//Do your stuff with the attr parameters, if you really need this here
//...
//Send your stuff to the server
$.post("recep.php", { pars: "Your pars here"},
function(receivedData) {
//open whatever you want with the html from the server
$('#whateverId').html('receivedData');
});
});
});
</script>
要使用表单检索值,只需对表单进行id并从函数中调用它 var $ input = $('#form:input')。val();