如何将JQuery值传递给下一个PHP页面?


How do I pass JQuery values to next PHP page?

背景信息:我使用Spectrum.js http://bgrins.github.io/spectrum/作为颜色选择器。为了在表单中使用它,它被设置为输入类型文本。这在表单中用于将颜色传递给php解析器,然后该解析器将值与.pov povray文件组合,然后在unix系统上呈现。

我正试图将这个颜色选择器的值传递到下一个php页面。我花了好几个小时试图找到解决办法,但一无所获。

奇怪的是,我正在"提醒"我的test_done .php页面的值,我可以在警告中看到正确的值。当我让按钮只是作为按钮时,这是有效的。当我改变按钮类型提交,虽然它不再工作。我希望在单击提交时看到颜色选择器的值。任何帮助都是非常感激的,因为我正在拔我的头发!我只是想从tester.php的值张贴到test_done .php,我不知道为什么它不工作,当我有它警报我得到正确的值,但当我试图改变按钮提交,使值张贴所有我得到的是rgb<0,0,0>.

test .php代码:

    <form action="tester_done.php" method="post">
<input type='text' class = "basic" name ="field1" id = "field1"/>
<input type='text' class = "basic2" name ="field2" id = "field2"/>
<input type="button" value="Submit" id="send">
</form>
 <script type="text/javascript">
$(".basic").spectrum({
    preferredFormat: "rgb",
    color: "#ffcccc"
}); 

$(".basic2").spectrum({
    preferredFormat: "rgb",
    color: "#ff0"
}); 
jQuery(function(){
    var field1 = $('#field1');
    var field2 = $('#field2');
    $('#send').click(function(){
        jQuery.ajax({
            type: "POST",
            url: "tester_done.php",
            data: {field1value: field1.val(), field2value: field2.val()},
            dataType: "html",
            success: function(data){
                alert(data);
            }
        });
    });
});
</script>
test_done .php代码:
 <?php
$base_value=255;
$characters = array("(", "r", "g", "b", ")");
$field1value = isset($_POST['field1value'])? $_POST['field1value'] : ''; 
$nfield1value = str_replace($characters, "", $field1value);
$nsfield1value = $nfield1value;
$nsf1arr = array_map("intval", explode(", ", $nsfield1value));
$c_body_r = $nsf1arr[0] / $base_value; 
$c_body_r_round = round ($c_body_r, 6);
$c_body_g = $nsf1arr[1] / $base_value; 
$c_body_g_round = round ($c_body_g, 6);
$c_body_b = $nsf1arr[2] / $base_value; 
$c_body_b_round = round ($c_body_b, 6);
$c_body = "rgb<".$c_body_r_round.", ".$c_body_g_round.", ".$c_body_b_round.">";
echo $c_body;
$field2value = isset($_POST['field2value'])? $_POST['field2value'] : ''; 
$nfield2value = str_replace($characters, "", $field2value);
$nsfield2value = $nfield2value;
$nsf2arr = array_map("intval", explode(", ", $nsfield2value));
$c_top_r = $nsf2arr[0] / $base_value; 
$c_top_r_round = round ($c_top_r, 6);
$c_top_g = $nsf2arr[1] / $base_value; 
$c_top_g_round = round ($c_top_g, 6);
$c_top_b = $nsf2arr[2] / $base_value; 
$c_top_b_round = round ($c_top_b, 6);
$c_top = "rgb<".$c_top_r_round.", ".$c_top_g_round.", ".$c_top_b_round.">";
echo $c_top;
?>

你不需要JQuery!"& lt;Form action=" test_done .php" method="post">"负责发布包含在表单input标签中的数据。

但是,如果你想要一个ajax响应,我会建议摆脱动作属性,并使用. serializearray ()在您的$的数据字段。Ajax调用,以形式作为url参数传递数据。

可能用法:给定表单id="NewForm", $。ajax({类型:"文章",url:"tester_done.php",数据:$ (' # NewForm中将').serializeArray () ,数据类型:"html",成功:功能(数据){警报(数据);}});

注意: 传递的参数名称与html表单中的输入标签名称相同,即对于field1输入,test_done .php中的$_POST['field1'],当使用此方法时

您也可以使用submit:

$('form').submit(function(){
    jQuery.ajax({
        type: "POST",
        url: "tester_done.php",
        data: {field1value: field1.val(), field2value: field2.val()},
        dataType: "html",
        success: function(data){
            alert(data);
        }
    });
});

你也可以像以前一样让按钮成为一个简单的按钮(不提交),然后用JavaScript提交表单:

$('#send').click(function(){
    jQuery.ajax({
        type: "POST",
        url: "tester_done.php",
        data: {field1value: field1.val(), field2value: field2.val()},
        dataType: "html",
        success: function(data){
            alert(data);
        }
    });
    $('form').submit();
});