0

我有一个接受用户输入的 HTML 表单:

<form action="script_conv.php" method="post">
Convert: <input type="number" name="input" id="input">
<select name="unit1" id="unit1">
<option value="w">Words</option>
<option value="l">Lines</option>
<option value="p">Pages</option>
<option value="r">Recorded Minutes</option>
<option value="f">Finished Minutes</option>
</select>
to
<select name="unit2" id="unit2">
<option value="w">Words</option>
<option value="l">Lines</option>
<option value="p">Pages</option>
<option value="r">Recorded Minutes</option>
<option value="f">Finished Minutes</option>
</select>
<input type="submit">
</form>

php 脚本获取用户数据并执行一些计算:

<?php
$input=$_POST["input"];
$unit1=$_POST["unit1"];
$unit2=$_POST["unit2"];

(bunch of if...else statements)

echo "<ul>";
echo "<li>$cat1f</li>";
echo "<li>$cat2f</li>";
echo "<li>$cat3f</li>";
echo "</ul>";
?>

这一切都很好,但是函数的结果当然会返回到新页面。我想将该函数的结果附加到同一页面。我知道这将需要 AJAX/jQuery,但我尝试过的没有任何效果。谁能给我一些指导?

非常感激!

4

3 回答 3

0

试试这个:

$(function(){
    $('form').submit(function(e){
        e.preventDefault();

        $.post('/path/to/your/php', $(this).serialize(), function(response){
            // do something with the response
        });
    });
});
于 2013-05-13T04:43:48.870 回答
0

试试 test.php(html):-

<form method='post'>
Convert: <input type="number" name="input" id="input">
<select name="unit1" id="unit1">
<option value="w">Words</option>
<option value="l">Lines</option>
<option value="p">Pages</option>
<option value="r">Recorded Minutes</option>
<option value="f">Finished Minutes</option>
</select>
to
<select name="unit2" id="unit2">
<option value="w">Words</option>
<option value="l">Lines</option>
<option value="p">Pages</option>
<option value="r">Recorded Minutes</option>
<option value="f">Finished Minutes</option>
</select>
<input type="button" onclick="getvalue();">
</form>

test.php(脚本函数):-

<script src="http://localhost:8004/js/jquery-1.9.1.js"></script>
<script>
function getvalue() {
       var input= document.getElementById('input').value;
    var unit1=document.getElementById('unit1').value;
    var unit2=document.getElementById('unit2').value;

        $.ajax({
        type: "POST",
        url: "http://localhost:8004/test/test.php",
        data: { input: input,unit1:unit1, unit2:unit2,fun:'getvalue' }
        }).done(function( data ) 
        {
            alert(data);
        }); 
}

</script>

此 (test.php) 文件顶部的 php 代码:-

<?php if(isset($_REQUEST['fun']) == 'getvalue') 
{
echo $_REQUEST['input'].$_REQUEST['unit1'].$_REQUEST['unit2'];
exit();
}
?>

您需要退出,否则它将显示此文件中的所有数据,因此请使用另一种方式使用 php 在 php 中执行

从同一页面中删除操作<form method="post">并在同一页面上获得响应

于 2013-05-13T05:18:52.377 回答
0

可能这对您有帮助并满足您的要求 http://sharp-coders.blogspot.in/2012/06/submit-form-using-ajax-without.html

于 2013-05-14T07:57:21.323 回答