Question

我有以下HTML代码：

<form method="post" action="the_file.php" id="the-form">
    <input type="text" name="the_input" value="<?php if ( isset( $_POST['the_input'] ) echo $_POST['the_input]; ?>">
    <button type="submit" name="eat_something" value="TRUE">Eating</button>
    <button type="submit" name="eat_something" value="FALSE">Don't Eat</button>
</form>
<textarea id="result"></textarea>

跟着这个JS：

$('#the-form').bind('submit', submitForm);
function submitForm(evt) {
    jQuery.post(
        $(this).attr('action'),
        $(this).serialize(),
        function(data) {
            $('#result').empty().append(data).slideDown();
        });
    evt.preventDefault();
}

我还有一个PHP脚本，它从提交时的输入中接收$ _POST值，并运行条件来测试单击了哪个提交按钮。

像这样：

$input = $_POST['the_input'];
$eating = $_POST['eat_something'];
if ( $eating == 'TRUE' ) {
    // Do some eating...
} else {
    // Don't you dare...
}

如果我不使用jQuery.post（）函数，则会发布按钮的提交值。但是，出于某种原因，我无法使用jQuery.post（）函数将按钮值传递给PHP $ _POST。如果我不使用jQuery.post（），则输出不会附加到textarea，而是以文本格式附加到单独的页面上，如文档。我也尝试在按钮$('button[type=submit]').bind('submit', submitForm);上调用提交功能，但这也无法解决我的问题。

先谢谢你的帮助。

Answer 1

您忘记了)输入中的单引号和the_name。

<input type="text" name="the_input" value="<?php if (isset($_POST['the_input'])) { echo $_POST['the_input'] ; } ?>">

并且要获取表单按钮按下的值，您需要手动附加值以序列化。

$form.serialize() + "&submit="+ $('button').attr("value")

示例

<script type="text/javascript"> $(function() { $('button[type="submit"]').on('click',function(e) { e.preventDefault(); var submit_value = $(this).val(); jQuery.post ( $(this).attr('action'), $(this).serialize()+ "&submit="+ submit_value, function(data) { $('#result').empty().append(data).slideDown(); } ); }); }); </script>

完成经过测试的代码

<?php if(isset($_POST['the_input'])) { $input = $_POST['the_input']; $eating = $_POST['eat_something']; exit; } ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>StackOverFlow</title> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript"> $(function() { $('button[type="submit"]').on('click',function(e) { e.preventDefault(); var submit_value = $(this).val(); jQuery.post ( $('#the-form').attr('action'), $('#the-form').serialize()+ "&eat_something="+ submit_value, function(data) { $('#result').empty().append(data).slideDown(); } ); }); }); </script> </head> <body> <form method="post" action="random.php" id="the-form"> <input type="text" name="the_input" value="<?php if (isset($_POST['the_input'])) { echo $_POST['the_input'] ; } ?>"> <button type="submit" name="eat_something" value="TRUE">Eating</button> <button type="submit" name="eat_something" value="FALSE">Don't Eat</button> </form> <textarea id="result"></textarea> </body> </html>

Answer 2

最简单的答案是：

<form method="post" action="the_file.php" id="the-form">
    <input type="text" name="the_input" value="<?php if ( isset( $_POST['the_input'] ) echo $_POST['the_input']; ?>">
    <input type="submit" name="eat_something" value="Eating" />
    <input type="submit" name="eat_something" value="Don't Eat" />
</form>

当然，这并不能完全满足您的需求。

您也可以这样做：

<form method="post" action="the_file.php" id="the-form">
    <input id="theInput" type="text" name="the_input" value="<?php if ( isset( $_POST['the_input'] ) echo $_POST['the_input']; ?>">
    <button type="button" name="eat_something" data-value="TRUE">Eating</button>
    <button type="button" name="eat_something" data-value="FALSE">Don't Eat</button>
</form>

$('#the-form button').bind('click', function(){
    jQuery.post($('#the-form').attr('action'),
    {
        the_input: $('#theInput').val(),
        eat_something: $(this).attr('data-value')
    },
    function(data) { $('#result').empty().append(data).slideDown() },
    'json'
});

Answer 3

将按钮更改为此（用表格名称更改）..

<input type="hidden" name="eat_something" value="" />
<input type="button" onclick="$('input[name=eat_something]').val('TRUE')" />
<input type="button" onclick="$('input[name=eat_something]').val('FALSE')" />

Javascript函数和PHP都没问题。

谢谢！

@leo

PHP使用jQuery .post（）提交带有多个提交按钮的表单

3 个答案: